Web Socket & Socket.io

gougoujiang 发布于2019-08-21 10:53 / 2820人阅读

摘要：但是，反过来却是不可能的服务器端发生了一个事件，服务器无法将这个事件的信息实时主动通知它的客户端。这种做法是无奈之举，实际上对服务器客户端双方都造成了大量的性能浪费。用于发送，用户接受。

HTTP

HTTP无法轻松实现实时应用：

HTTP协议是无状态的，服务器只会响应来自客户端的请求，但是它与客户端之间不具备持续连接。

我们可以非常轻松的捕获浏览器上发生的事件（比如用户点击了盒子），这个事件可以轻松产生与服务器的数据交互（比如Ajax）。但是，反过来却是不可能的：服务器端发生了一个事件，服务器无法将这个事件的信息实时主动通知它的客户端。只有在客户端查询服务器的当前状态的时候，所发生事件的信息才会从服务器传递到客户端。

但是，确实聊天室确实存在

方法：

长轮询：客户端每隔很短的时间，都会对服务器发出请求，查看是否有新的消息，只要轮询速度足够快，例如1秒，就能给人造成交互是实时进行的印象。这种做法是无奈之举，实际上对服务器、客户端双方都造成了大量的性能浪费。

长连接：客户端只请求一次，但是服务器会将连接保持，不会返回结果（想象一下我们没有写res.end()时，浏览器一直转小菊花）。服务器有了新数据，就将数据发回来，又有了新数据，就将数据发回来，而一直保持挂起状态。这种做法的也造成了大量的性能浪费。

WebSocket协议

WebSocket协议能够让浏览器和服务器全双工实时通信，互相的，服务器也能主动通知客户端

WebSocket的原理非常的简单：利用HTTP请求产生握手，HTTP头部中含有WebSocket协议的请求，所以握手之后，二者转用TCP协议进行交流（QQ的协议）。现在的浏览器和服务器之间，就是QQ和QQ服务器的关系了。所以WebSocket协议，需要浏览器支持，更需要服务器支持。

支持WebSocket协议的浏览器有：Chrome 4、火狐4、IE10、Safari5

支持WebSocket协议的服务器有：Node 0、Apach7.0.2、Nginx1.3

Socket.IO是业界良心，新手福音。它屏蔽了所有底层细节，让顶层调用非常简单。并且还为不支持WebSocket协议的浏览器，提供了长轮询的透明模拟机制。

Node.js上需要写一些程序，来处理TCP请求。使用require("dgram") 模块

Node的单线程、非阻塞I/O、事件驱动机制，使它非常适合Socket服务器。

Socket.io

npm install socket.io

制作index.html页面。页面中必须引入 /socket.io/socket.io.js, 调用io函数，取得socket对象。

服务器中：

var io = require("sockte.io")(server);
io.on("connection",function( socket ){
    //socket 对象
    socket.on("tiwen",function( msg ){
        console.log("服务器接受到了请求");
        //sockte.emit("huida","ok"); //单条返回
        //广播 , 就是给当前所有用户的发送信息。
        io.emit("huida","ok");
    });
});

客户端和服务器，都有socket对象。两个对象都具有emit，和on的时间。emit用于发送，on用户接受。
发送的内容可以是任何类型的值。

案例

前台页面：



index页面
信息内容：
发送：

后台：

var http = require("http");
var fs = require("fs");

var server = http.createServer(function ( req,res ) {
  if (  req.url == "/" ) {
    // 显示首页
    fs.readFile("./index.html",function ( err,data ) {
      res.end(data);
    });
  }
});


// 创建io对象
var io = require("socket.io")(server);

// 监听连接事件
io.on("connection",function ( socket ) {
  console.log( "一个客户端连接了" );
  socket.on("tiwen",function ( msg ) {
        // console.log( "提问为：" + msg );
        // socket.emit("huida","好呀");
    // 加上广播
    io.emit("huida",msg);
  });
});

server.listen(80);

服务器托管专线服务 socket.io cdn socket.io webrtc socket.io socket.io webrtc

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/86359.html

【Node之web通信Socket.IO】

摘要：简介是的一个模块，他提供通过进行通信的一种简单方式，协议很复杂，但是提供了服务器和客户端双方的组件，所以只需要一个模块就可以给应用程序加入对的支持。而且还能支持不同的浏览器。它们之间有什么区别呢区别在于的是持久性的。环境：Node v8.2.1; Npm v5.3.0; OS Windows10 在web开发中，我们使用HTTP协议，HTTP协议是基于文本的单向通讯机制，当我们想要从...

xzavier 2019-08-21 16:57 评论0 收藏0
Node.js和Socket.IO搭建Web Chat application

摘要：是，是的，它可以建立起一个基于事件的实时的双向交流方式，极大的简化了的处理过程。开始搭建这个应用几乎只需要和最初级的知识，因为只搭建一个基本的程序。安装好后创建一个，来配置应用。 WebSocket与Socket.IO WebSocket是一种协议，有了它就可以在TCP协议的基础上在浏览器和服务器之间建立起了一种全双工的通道，它完全兼容HTTP协议，有了它使得Web应用程序可以在浏览器...

kviccn 2019-08-20 16:30 评论0 收藏0
vue2.0开发聊天程序(六) 服务端的webScoket

大吉大利，今晚吃鸡！　　　　　　　　　　　　　　　　　　　- PUBG 时隔多日，终于再次拾起这个拖了很久的项目。并不是因为没时间，也不是因为这个项目对于我来说有多困难，就是一个字————懒。此项目的后台，当然是选择node.js来实现。作为一个前端，node.js比起java、php简单多了。 node支持的webSocket 在npm中有很多支持webSocket的模块，包括socket.io...

hiyayiji 2019-08-22 11:06 评论0 收藏0