Question

我有一个Nodejs Server.js代码：

第一个概念：

var http = require('http');
var express = require('express');
var app = express();
var path = require('path');

var conn= http.createServer(app).listen(3000, function () {
  console.log("server Running at Port 3000");
});

var WebSocketServer = require('ws').Server;
var wss = new WebSocketServer({server: conn});

我有一个带有java脚本的index.html代码：

<html>
<body> 

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

</body>
</html>

在myscript.js里面我有：

var connection = new WebSocket('ws://localhost:3000');

我在浏览器上打开http://localhost:3000时工作正常。

第二概念：

我的server.js：

var WebSocketServer = require('ws').Server,
wss = new WebSocketServer({ port: 3000}) ;

wss.on('connection', function (connection) {

});

wss.on('listening', function () {
    console.log("Server started...");
});

和HTML和客户端java脚本与上面类似。

当我在浏览器上打开http://localhost:3000时，这不起作用。为什么？我想澄清一下我的怀疑。为什么第一种方法起作用，第二种方法不起作用？

Answer 1

要专门回答您的问题：为什么Web套接字在nodejs上的行为方式不同？答案是：它不应该。在代码的第二个版本中，您不会在端口3000上向客户端提供任何HTML或JS文件，因此浏览器无法下载任何HTML。

如果您希望它按预期工作，那么您需要将一些HTML和JS文件提供给访问http://localhost:3000/的浏览器，否则它将无法连接。

我写了一些示例代码 - 服务器端和客户端 - 关于如何使用WebSocket来完成您在此处尝试的操作。它是available on GitHub，我最初是为这个答案写的：Differences between socket.io and websockets。

此处您的问题的源代码的相关部分是：

WebSocket服务器

使用Express.js的WebSocket服务器示例：

var path = require('path');
var app = require('express')();
var ws = require('express-ws')(app);
app.get('/', (req, res) => {
  console.error('express connection');
  res.sendFile(path.join(__dirname, 'ws.html'));
});
app.ws('/', (s, req) => {
  console.error('websocket connection');
  for (var t = 0; t < 3; t++)
    setTimeout(() => s.send('message from server', ()=>{}), 1000*t);
});
app.listen(3001, () => console.error('listening on http://localhost:3001/'));
console.error('websocket example');

来源：https://github.com/rsp/node-websocket-vs-socket.io/blob/master/ws.js

WebSocket客户端

使用vanilla JavaScript的WebSocket客户端示例：

var l = document.getElementById('l');
var log = function (m) {
    var i = document.createElement('li');
    i.innerText = new Date().toISOString()+' '+m;
    l.appendChild(i);
}
log('opening websocket connection');
var s = new WebSocket('ws://'+window.location.host+'/');
s.addEventListener('error', function (m) { log("error"); });
s.addEventListener('open', function (m) { log("websocket connection open"); });
s.addEventListener('message', function (m) { log(m.data); });

来源：https://github.com/rsp/node-websocket-vs-socket.io/blob/master/ws.html

不是调试不起作用的代码，而是从有效的东西开始，然后从那里开始。看看它是如何工作的，并随意更改并在项目中使用它 - 它是在MIT license下发布的。

为什么web socket在nodejs上表现不同？

1 个答案:

WebSocket服务器

WebSocket客户端