Socket.io 无法在控制台中记录聊天消息

Question

我正在浏览 Socket.io tutorial on creating a chat room，我无法让我的应用程序将聊天消息记录到控制台。

应用程序在用户连接和断开连接时进行记录，但在传递消息时不进行记录。

有什么想法吗？

我的 index.html 页面的相关部分：

<script src="/socket.io/socket.io.js"></script>
<script src="http://code.jquery.com/jquery-1.11.1.js"></script>

<script>
  var socket = io();
  $('form').submit(function() {
    socket.emit('chat message', $('#m').val());
    $('#m').val('');
    return false;
  });
</script>

<body>
  <ul id="messages"><ul>

  <form action="">
    <input id="m" autocomplete="off" /><button>Send</button>
  </form>
</body>

我的 index.js 文件：

var express = require('express');
var app = express();
var http = require('http').Server(app);
var io = require('socket.io')(http);

app.use(express.static('public'));

app.get('/', function(req, res){
  res.sendFile(__dirname + '/index.html');
});


io.on('connection', function(socket){
  console.log('a user connected');

  socket.on('disconnect', function(){
    console.log('user disconnected');
  });

  socket.on('chat message', function(msg) {
    console.log("message: " + msg);
  });
});

Answer 1

我已经开始工作了！

解决步骤： - 将带有事件监听器的脚本标签分离到一个单独的 JS 文件中 - 将该 JS 文件包含在脚本标签最初所在的同一位置 - 文档准备就绪时加载 chatListener

我的文件现在看起来像这样，一切都很好：

index.html:

<script src="/socket.io/socket.io.js"></script>
<script src="http://code.jquery.com/jquery-1.11.1.js"></script>

<script src="main.js"></script>

<body>
  <ul id="messages"><ul>

  <form action="">
    <input class="chat" id="m" autocomplete="off" />
    <input class="btn" type="submit" value="Send" />
  </form>
</body>

index.js: 没有变化

main.js:

var socket = io();

var chatListener = function() {
  $('form').submit(function() {
    socket.emit('chat message', $('#m').val());
    $('#m').val('');
    return false;
  });
}

$(document).ready(function() {
  chatListener();
})

最后，我认为是初学者的JS错误；我在页面顶部加载脚本（按照教程的建议），表单上的事件侦听器从未注册。

Socket.io 无法在控制台中记录聊天消息

Socket.io failing to log chat message in console

sockets

websocket

node.js

socket.io