将socket.io/socket.io.js加载到html头中返回"ReferenceError:io未定义

Loading socket.io/socket.io.js into html head returning "ReferenceError: io is not defined"

本文关键字：io socket quot 未定义 返回 ReferenceError js 加载 html      更新时间：2023-09-26

我正在做一个简单的socket.io项目，遇到了麻烦。当我将脚本<script src="/socket.io/socket.io.js"></script><script type="text/javascript">var socket = io(); </script>添加到头中时，我希望应用程序能够识别这一点，但我在控制台中收到了错误消息GET http://localhost:5678/socket.io/socket.io.js和Uncaught ReferenceError: io is not defined。我使用的是express框架。

var express = require('express');
var router = express.Router();
var http = require('http').Server(express);
var io = require('socket.io')(http);
/* GET home page. */
router.get('/', function(req, res) {
  res.render('index', { title: 'NodeIM' });
});
io.on('connection', function(socket){
  console.log('a user connected');
  socket.on('disconnect', function(){
    console.log('user disconnected');
  });
});
server = http.listen(3000, function() {
    console.log('Listening on port %d', server.address().port);
});
module.exports = router;

HTML:

<html>
   <head>
      <title>NodeIM</title>
      <link rel="stylesheet" href="/stylesheets/style.css">
      <script src="/socket.io/socket.io.js"></script>
      <script type="text/javascript">var socket = io(); </script>
      <style type="text/css"></style>
   </head>
   <body>
      <h1>NodeIM</h1>
      <p>Welcome to NodeIM</p>
      <hr>
      <ul id="messages"></ul>
      <form id="im_form" action=""><input id="m" autocomplete="off"><button>Send</button></form>
   </body>
</html>

注意：我也尝试过遵循socket.io-ReferenceError:io没有定义，并将我的src更改为src="http://localhost:5678/socket.io/socket.io.js"，但它并没有解决这个问题。我还尝试使用Node.js socket.io.js找不到或io没有定义，这只是向我展示了另一种需要socket.io的方法，但并不能解决我使用的ReferenceError问题

您将/socket.io/socket.io.js用于src是正确的。但是，http服务器的设置有一个拼写错误：var http = require('http').Server(express);可能应该是var http = require('http').Server(router);。

如Socket.io上的聊天演示中所述，您应该将<script>直接放在关闭</body>-标记上方。像这样：

<script src="/socket.io/socket.io.js"></script>
<script>
    var socket = io();
</script>
</body>
相关文章：