HTML 文件找不到嵌入的 js 文件答案

【问题标题】：HTML file can't find embedded js filesHTML 文件找不到嵌入的 js 文件
【发布时间】：2020-10-28 18:54:29
【问题描述】：

我目前正在尝试使用 Node.js、Express 和 Socket.io 制作游戏。但是，当我尝试在本地运行它时，我收到一个 404 错误，指出找不到我的 javascript 文件。我的文件结构如下：

root
| game
| | game.html
| | game.js
| index.js

我的代码如下所示：

index.js

//Dependencies
var express = require('express'); //Pulls in Express framework
var http = require('http') //Pulls in http module
var socketio = require('socket.io'); //Pulls in Socket.io framework

//Instance Declarations
var app = express(); //Creates an Express instance
var server = http.createServer(app); //Creates an http server using the Express framework
var port_to_listen = process.env.PORT || 3000; //Specifies which port to listen on
var socket = socketio(http); //Creates Socket.io instance related to the server just created

//Default page displayed, always sent to index.html
app.get('/', (req, res) => {
  res.sendFile(__dirname + '/game/game.html');
});

//Tells the server to listen for any incoming inconnections
server.listen(port_to_listen, () => {
  console.log(`listening on ${port_to_listen}`);
});

socket.on('connection', function(client) {
    console.log('Connection made')
});

//Testing to ensure socketio works
setInterval(function() {
  socket.sockets.emit('message', 'hi!');
}, 1000);

game.js

var socket = io();
socket.on('message', function(data) {
  console.log(data);
});

game.html

<html>
  <head>
    <title>A Multiplayer Game</title>
    <style>
      canvas {
        width: 800px;
        height: 600px;
        border: 5px solid black;
      }
    </style>
    <script src="/socket.io/socket.io.js"></script>
  </head>
  <body>
    <canvas id="canvas"></canvas>
  </body>
  <script type = "text/javascript" src="game.js"></script>
</html>

错误消息如下所示：

我应该怎么做才能修复这些错误？

编辑：当我将 game.js 的 src 路径更改为

时，这些错误仍然存在

<script type = "text/javascript" src="/game/game.js"></script>

【问题讨论】：

标签： javascript html node.js express socket.io

【解决方案1】：

您只有一个提供文件的路由：

app.get('/', (req, res) => {
  res.sendFile(__dirname + '/game/game.html');
});

其余文件（您的 css、js 等）不会自动提供

您需要为此创建路线，就像这里解释的 Serving static files in Express

【讨论】：

我尝试添加“app.use(express.static('game'));”但未能解决任何错误
没关系。我需要创建一个虚拟路径前缀才能使其正常工作。
是的，一个带有前缀的常见问题 :)