Question

我大约在socket.io chat教程的中途。 /页面看起来正确地为index.html提供服务但是当我点击ENTER或SEND时页面重置并且我被发送到/?，这也是`index.html'。

js和html取自socket.io网站：

<!doctype html>
<html>
  <head>
    <title>Socket.IO chat</title>
    <style>
      * { margin: 0; padding: 0; box-sizing: border-box; }
      body { font: 13px Helvetica, Arial; }
      form { background: #000; padding: 3px; position: fixed; bottom: 0; width: 100%; }
      form input { border: 0; padding: 10px; width: 90%; margin-right: .5%; }
      form button { width: 9%; background: rgb(130, 224, 255); border: none; padding: 10px; }
      #messages { list-style-type: none; margin: 0; padding: 0; }
      #messages li { padding: 5px 10px; }
      #messages li:nth-child(odd) { background: #eee; }
    </style>
  </head>
  <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>
</html>

JavaScript有一些关于连接和断开连接的基本功能 - 这些工作正常。聊天消息设置打印到控制台。相反，页面只会重置。

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

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

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

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

http.listen(3001, function(){
  console.log('listening on *:3000');
});

Node还警告不推荐sendFile。我正忙于尝试使用本教程，即使教程稍微过时，我也不想学习新的语法。

这是verion 4.4.0

express deprecated res.sendfile: Use res.sendFile instead index.js:6:7

Answer 1

与sendfile有同样的问题，这是教程中需要修复的错误改为使用

 res.sendFile(__dirname + '/index.html');

这是它在本教程开头使用的内容。

不要认为这会解决你的其他问题，但是当我犯同样的错误时，我的服务器在语法描述问题上冻结了。我也是新人，所以我不能把它留作评论，所以我会留下一个不完整的答案。

感谢stackoverflow ...

Answer 2

您需要修复HTML文件。现在你在头部和身体之间有脚本。你需要在关闭body block之前移动它们，你的代码才会开始工作。

<!doctype html>
<html>
  <head>
    <title>Socket.IO chat</title>
    <style>
      * { margin: 0; padding: 0; box-sizing: border-box; }
      body { font: 13px Helvetica, Arial; }
      form { background: #000; padding: 3px; position: fixed; bottom: 0; width: 100%; }
      form input { border: 0; padding: 10px; width: 90%; margin-right: .5%; }
      form button { width: 9%; background: rgb(130, 224, 255); border: none; padding: 10px; }
      #messages { list-style-type: none; margin: 0; padding: 0; }
      #messages li { padding: 5px 10px; }
      #messages li:nth-child(odd) { background: #eee; }
    </style>
  </head>
  <body>
    <ul id="messages"></ul>
    <form action="">
      <input id="m" autocomplete="off" /><button>Send</button>
    </form>
  <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>
</html>

关于res.sendfile，只需使用res.sendFile。他们在express v4.8.0中删除了别名sendfile。

socket io教程 - 表单保持重置

2 个答案: