socket.io和websockets之间的区别

node.js中的socket.io和websockets之间有什么区别？ node.js中的socket.io和websockets有什么区别？
它们都是服务器推送技术吗？ 我觉得唯一的区别是、

1.socket.io允许我通过指定一个事件名称来发送/发射消息。

2.2.在socket.io的情况下，来自服务器的消息将到达所有的客户端，但在websockets中，我不得不保留一个所有连接的数组，并通过它循环向所有客户端发送消息。

另外、 我想知道为什么网络检查器（如Chrome/firebug/fiddler）无法从服务器上捕获这些消息（来自socket.io/websocket）？

请澄清这一点。

Kevin Guan
已编辑的问题 19日 五月 2016 в 5:43
编程
google-chrome firebug node.js websocket socket.io
11日 四月 2012 в 6:57
9 种观点

误解

关于WebSocket和Socket.IO，有一些常见的误解：

1.第一个误解是，使用Socket.IO明显比使用WebSocket简单，但情况似乎并非如此。请看下面的例子。

2.第二个误解是，WebSocket在浏览器中没有得到广泛支持。更多信息见下文。

3.第三个误解是，Socket.IO将连接降级作为老式浏览器的退路。实际上，它假定浏览器是旧的，并启动与服务器的AJAX连接，在交换了一些流量后，在支持WebSocket的浏览器上会被升级。详情见下文。

我的实验

我写了一个npm模块来演示WebSocket和Socket.IO的区别：

这是一个服务器端和客户端代码的简单例子--客户端使用WebSocket或Socket.IO连接到服务器，服务器以1s的间隔发送三条信息，这些信息被客户端添加到DOM中。

服务器端

比较服务器端使用WebSocket和Socket.IO的例子，在Express.js应用程序中做同样的事情：

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

Socket.IO服务器

使用Express.js的Socket.IO服务器例子：

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

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

客户端

比较客户端使用WebSocket和Socket.IO的例子，在浏览器中做同样的事情：

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

Socket.IO客户端

使用vanilla JavaScript的Socket.IO客户端例子：

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 socket.io connection');
var s = io();
s.on('connect_error', function (m) { log("error"); });
s.on('connect', function (m) { log("socket.io connection open"); });
s.on('message', function (m) { log(m); });

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

网络流量

要看到网络流量的差异，你可以[运行我的测试]（https://github.com/rsp/node-websocket-vs-socket.io#readme）。以下是我得到的结果：

WebSocket结果

2个请求，1.50 KB，0.05 s

从这2个请求中：

1.HTML页面本身 2.连接升级到WebSocket

(连接升级请求在开发者工具上可见，有101个切换协议的响应。)

Socket.IO结果

6个请求，181.56 KB，0.25 s

从这6个请求中

  1. HTML页面本身 2.Socket.IO'的JavaScript（180千字节） 3.第一个长时间轮询的AJAX请求 4.第二个长轮询的AJAX请求 5.第三个长轮询的AJAX请求 6.连接升级到WebSocket

屏幕截图

我在localhost上得到的WebSocket结果：

。

我在localhost上得到的Socket.IO结果：

。

测试自己

快速启动：

# Install:
npm i -g websocket-vs-socket.io
# Run the server:
websocket-vs-socket.io

在浏览器中打开http://localhost:3001/，用Shift+Ctrl+I打开开发者工具，打开网络标签，用Ctrl+R重新加载页面，查看WebSocket版本的网络流量。

在浏览器中打开http://localhost:3002/，用Shift+Ctrl+I打开开发者工具，打开网络标签，用Ctrl+R重新加载页面，以查看Socket.IO版本的网络流量。

要卸载：

# Uninstall:
npm rm -g websocket-vs-socket.io

浏览器兼容性

截至2016年6月，WebSocket可在除Opera Mini之外的所有浏览器上运行，包括高于9的IE。

这是截至2016年6月，WebSocket在Can I Use上的浏览器兼容性：

！[在此输入图片描述][3] 。

参见http://caniuse.com/websockets，以了解最新信息。

rsp
编辑本段答案25日 七月 2016 в 2:42
评论(6)
解决办法

它的优点是简化了你在第2条中描述的WebSockets的使用，可能更重要的是，在浏览器或服务器不支持WebSockets的情况下，它提供了其他协议的故障转移。我将避免直接使用WebSockets，除非你非常熟悉它们在什么环境下不能工作，而且你有能力绕过这些限制。

这是一篇关于WebSockets和Socket.IO的好文章。

http://davidwalsh.name/websocket

kiarashws
编辑本段答案17日 十月 2018 в 1:31
评论(10)

我将提供一个反对使用socket.io的论据。

我认为使用socket.io仅仅是因为它有回退功能并不是一个好主意。让 IE8 消失吧。

在过去，有很多NodeJS的新版本破坏了socket.io的情况。 你可以查看这些例子... https://github.com/socketio/socket.io/issues?q=install+error

如果你去开发一个Android应用或需要与你现有的应用一起工作的东西，你可能会马上与WS一起工作，socket.io可能会在那里给你带来一些麻烦...

另外，Node.JS的WS模块使用起来也非常简单。

Jim Buck
编辑本段答案11日 二月 2016 в 3:12
评论(0)