无法让 socket.io 在 node.js MVC 应用程序上工作

Question

我正在尝试创建一个相对简单的游戏，其中涉及 nodejs (MVC) 中的房间和聊天。 但我似乎无法让 socket.io 工作......

这是主服务器文件（ index.js ）：

const express  = require('express');
const app      = express();
const mongoose = require('mongoose');
const dotenv   = require('dotenv');
const session  = require('express-session');
const server   = require('http').Server(app);
const io       = require('socket.io')(server);

dotenv.config();

const PORT     = 4111;
const passport = require('passport');

const { login_check } = require("./auth/passport");
login_check(passport);

const database = process.env.MONGOLAB_URI;
mongoose.connect(database, {useUnifiedTopology: true, useNewUrlParser: true }).then(() => console.log('Connected to database.')).catch(err => console.log(err));

app.set('view engine', 'ejs');
app.set('socketio', io)

app.use("/static", express.static("public"));
app.use(express.urlencoded({ extended: true }));
app.use(session({
    secret:'oneboy',
    saveUninitialized: true,
    resave: true
}));

app.use(passport.initialize());
app.use(passport.session());

app.use('/', require('./routes/router'));

server.listen(PORT, () => {
    console.log(`Listening to port: ${PORT}`);
});

io.on('connection', (socket) => { // THIS DOESNT FIRE
    console.log("XDASMFKL:JJSRDNGPOUIREn")
})

router.js ：

const express = require('express');

const { 
    register_view,
    register_user,
    login_view,
    login_user,
    logout_user, 
} = require("../controllers/login_controller");
const { protect_route }  = require("../auth/protect");
const { dashboard_view } = require("../controllers/dashboard_controller");
const { main_menu_view, create_game_view} = require("../controllers/main_menu_controller");
const { start_game } = require("../controllers/game_controller");
const { create_game, browse_games } = require("../controllers/create_game_controller");

const router = express.Router();

router.get('/', (req, res) => {
    res.redirect("/login");
});

router.get("/register", register_view);
router.get("/login", login_view);
router.get("/main", protect_route, main_menu_view);
router.get("/logout", logout_user);
router.get("/create_game_view", create_game_view);
router.get("/browse_games_view", browse_games);
router.get("/:game_name", start_game);

router.post("/create_game", create_game);
router.post("/register", register_user);
router.post("/login", login_user);
router.post("/logout", logout_user);

module.exports = router;

以及按顺序排列的 4 个主要视图（ main.ejs create_game_view.ejs browse_games_view.ejs和game_view.ejs ）：

主.ejs

<!DOCTYPE html>
    <head>
        <title>DrawGuess</title>
        <link rel="stylesheet" href="/static/stylesheets/main_style.css" type="text/css">
        <script src=”/socket.io/socket.io.js”></script>
    </head>
    <body>
        <div class="main-menu-container">
            <div class="user">
                <%= user.name %> 
            </div>
            <div class="menu-option-container">
                <a href="/create_game_view"><span class="menu-option">CREATE GAME</span> </a>
            </div>
            <div class="menu-option-container">
                <a href="/browse_games_view"><span class="menu-option">JOIN GAME</span></a>
            </div>
            <div class="menu-option-container">
                <a href="/logout"><span class="menu-option">LOGOUT</span></a>
            </div>
        </div>
    </body>

create_game_view.ejs

<!DOCTYPE html>
    <head>
        <title>DrawGuess</title>
        <link rel="stylesheet" href="/static/stylesheets/create_game_style.css" type="text/css">
        <script defer src="http://localhost:4111/socket.io/socket.io.js"></script>
    </head>
    <body>
        <div class="create-game-container">
            <form class="create-game-form" action="/create_game" method="POST">
                <label for="game_name_input" class="input-label">game name:</label><br>
                <input id="game_name_input" type="text" name="game_name" class="game-input" value="<%= user.name + 's'%> room ">
                
                <label for="min_player_input" class="input-label">min number of players:</label><br>
                <input id="min_player_input" type="number" min="1" max="8" name="min_player_input" class="game-input">

                <label for="max_player_input" class="input-label">max number of players:</label><br>
                <input id="max_player_input" type="number" min="1" max="8" name="max_player_input" class="game-input">                     

                <button type="submit" class="create-game-button">
                    <span class="create-game-span">CREATE GAME</span>
                </button>
            </form>
        </div>
    </body>

browse_games_view.ejs

<!DOCTYPE html>
    <head>
        <title>DrawGuess</title>
        <link rel="stylesheet" href="/static/stylesheets/browse_games_style.css" type="text/css">
        <script defer src="http://localhost:4111/socket.io/socket.io.js"></script>
    </head>
    <body>
        <div class="games-container">
            <span class="title">ACTIVE GAMES</span>
            <ul class="games-list">
                <% Object.keys(games).forEach(key => { %>
                    <div class="game">
                        <a href="/<%= key %> " class="game-name"> <%= key %> </a>
                    </div>
                <% }); %>
            </ul>
        </div>
    </body>

如果任何其他视图或模块是相关的，请告诉我，我会添加它们。 这已经感觉像是一个巨大的代码转储，所以我会在这里停下来。

无论如何，整个想法是，当用户登录时，他们可以选择创建或加入现有游戏，这些游戏应该是房间。 注册和登录工作，路由到这些视图和模块也工作，但我似乎无法让 socket.io 工作。

当我把它放在index.js文件中时它不起作用，我在game_controller.js模块中的一个函数上尝试了这个解决方案，如下所示（它很短，所以我会发布它）：

const start_game = (req, res) => {
    var io = req.app.get('socketio');

    io.on('connection', (socket) => { // NEITHER DOES THIS
         console.log(`user ${socket.id} connected.`)
    })

    res.render("game_view", {
        g_name: req.params.game_name,
    })
};

module.exports = {
    start_game,
}

两种尝试都不会记录任何内容。 整个想法是拥有独特的游戏室，聊天和其他事情可以单独进行，但目前我被困在第 1 方。这是我第一次搞乱MVC和socket.io ，所以错误可能非常明显和简单，但我就是看不到。