javascript - 为什么网络套接字在 nodejs 上表现不同?

标签 javascript java html node.js websocket

我有一个 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 时,这不起作用。为什么 ?我想澄清我的疑问。为什么第一种方法有效而第二种方法无效?

最佳答案

具体回答您的问题:为什么网络套接字在 nodejs 上的行为不同? 答案是:不应该。在代码的第二个版本中,您没有在端口 3000 上向客户端提供任何 HTML 或 JS 文件,因此浏览器无法下载任何 HTML。

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

我写了一些示例代码——包括服务器端和客户端——关于如何使用 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 客户端

使用普通 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 下发布.

关于javascript - 为什么网络套接字在 nodejs 上表现不同?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39765427/

相关文章:

java - 如何以数字0退出循环?但现在我有其他问题

java - 在.txt文件java中的不同行中写入问题

html - 响应式设计 : Allow user to also view Full Site

html - Cufon 字体不工作。有人请指教吗?

javascript - 使用单选按钮、highcharts、vb.net 从服务器获取数据

javascript - 使用 Carrierwave 的 ajax 请求中的照片 url

javascript - 使用 fetch 方法读取 RapidAPI JSON 响应

javascript - 原型(prototype)继承和new关键字

java - 解决 Thymeleaf 缺乏可选支持的问题

html - 如何使用 css flex boxes 创建 slider 布局?