5 回答

• 26

  Socket.IO使用WebSocket，当WebSocket不可用时，使用fallback algo进行实时连接 .

  回复于 2024-04-27T02:18:47+08:00
• 267

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

  我认为使用socket.io只是因为它有后备不是一个好主意 . 让IE8 RIP .

  在过去，很多情况下NodeJS的新版本已经破坏了socket.io . 您可以查看这些列表以获取示例... https://github.com/socketio/socket.io/issues?q=install+error

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

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

  回复于 2024-04-27T02:18:47+08:00
• 357

  误解

  关于WebSocket和Socket.IO的常见误解很少：

  • 第一个误解是使用Socket.IO比使用WebSocket要容易得多，而WebSocket似乎并非如此 . 见下面的例子 .

  • 第二个误解是WebSocket在浏览器中没有得到广泛支持 . 有关详细信息，请参见下文

  • 第三个误解是Socket.IO将连接降级为旧浏览器的后备 . 它实际上假设浏览器是旧的并且启动与服务器的AJAX连接，稍后在交换一些流量之后在支持WebSocket的浏览器上升级 . 请参阅下文了解详情 .

  我的实验

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

  • https://www.npmjs.com/package/websocket-vs-socket.io

  • https://github.com/rsp/node-websocket-vs-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 Server

  使用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

  网络流量

  要查看网络流量的差异，您可以run my test . 以下是我得到的结果：

  WebSocket结果

  2个请求，1.50 KB，0.05 s

  从这2个请求：

  • HTML页面本身

  • 连接升级到WebSocket

  （连接升级请求在具有101个交换协议响应的开发人员工具上可见 . ）

  Socket.IO结果

  6个请求，181.56 KB，0.25 s

  从这6个请求中：

  • HTML页面本身

  • Socket.IO的JavaScript（180千字节）

  • 首次长轮询AJAX请求

  • 秒长轮询AJAX请求

  • 第三次长轮询AJAX请求

  • 连接升级到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月Can I Use上WebSocket的浏览器兼容性：

  

  有关最新信息，请参阅http://caniuse.com/websockets .

  回复于 2024-04-27T02:18:47+08:00
• 15

  使用Socket.IO基本上就像使用jQuery - 你想支持旧版浏览器，你需要编写更少的代码，库将提供回退 . Socket.io使用websockets技术（如果可用），如果没有，则检查可用的最佳通信类型并使用它 .

  回复于 2024-04-27T02:18:47+08:00
• 4

  它的优点是它简化了＃2中描述的WebSockets的使用，可能更重要的是如果浏览器或服务器不支持WebSockets，它会为其他协议提供故障转移 . 我会避免直接使用WebSockets，除非您非常熟悉它们不起作用的环境，并且您能够解决这些限制 .

  这是对WebSockets和Socket.IO的良好读取 .

  http://davidwalsh.name/websocket

  回复于 2024-04-27T02:18:47+08:00