长连接 (1)

Websocket

​ 1. 什么是 Websocket？

​ 这是一种让客户端和服务器之间能够进行双向实时通信的技术。是 HTML 最新标准 H5 的一个协议规范，本质上是一个基于 TCP 的协议，通过 HTTP/HTTPS 协议发送一条特殊的请求进行握手后创建了一个 TCP 链接，此后浏览器/客户端和服务器之间便可以通过此链接来进行双向实时通信。

​ 2. Websocket 的好处

​ HTTP 协议是无状态、单项通信的，即客户端请求一次，服务器回复一次。如果想让服务起消息及时下发到客户端，需要采用类似与轮询的机制，即客户端定时频繁的想服务器发出请求，这样效率很低，而且 HTTP 数据爆头本身的自己两较大，浪费大量宽带和服务器资源；

​ ajax 和 Comet 技术，实现了双向通信切生了一定宽带，但仍然 需要发出请求，本质上仍然是轮询；

​ websocket 是 h5 推出的技术，使客户端和服务器之间能通过 HTTP 协议建立 TCP 连接，之后可以随时随地的进行双向通信，且交换包头信息量很小；

​ 3. websocket 的使用

​ 主要通过四个事件实现 Socket 的响应(onopen、onmessage、onclose、onerror)；

socket.io

​ socket.io 是将 WebSocket、AJAX 和其他的通信方式全部封装成统一的通信接口，也就是说使用 socket.io 时，不用担心兼容问题，底层会自动选用最佳的通信方式。

使用 socket.io：

​ 导入 socket.io:

链接服务：

​ 当客户端成功加载 socket.io 客户端文件后会获取到一个全局对象 io，我们将听过 io.connect 函数来向服务端发起连接请求。

var socket = io.connect('/');
socket.on('connect',function(){//链接成功})；
socket.on('disconnect',function(){//连接断开})

实时通讯：

on:接收消息;emit:发送消息:

​ 发送消息与接收消息 emit on key=>val;当我们成功建立连接后，我们可以通过 socket 对象的 send 函数来互相发送消息

emit 函数的用法:

​ 它有两个参数，第一个参数是事件名称，在接收端注册该事件就可以接收到发送过去的信息，事件名称可以自由定义，在不同的场景下，我们可以定义不同的事件来接收消息。第二个参数才是发送的数据

服务端事件：

​ 事件监听是实现通讯的基础。在一些关键的的状态下，socket.io 可以注册相应的事件，通过事件监听，我们可以在这些事件中作出反应，常用的事件如下： ​ 1. connection 客户端成功连接到服务器。 ​ 2. message 捕获客户端 send 信息。 ​ 3. disconnect 客户端断开连接。 ​ 4. error 发生错误。

客户端事件：

​ 较服务端而言，客户端提供更多的监听事件，在实时应用中，我们可以为这些事件注册监听并作出反应。 ​ 1. connect 成功连接到服务器。 ​ 2. connecting 正在连接。 ​ 3. disconnect 断开连接。 ​ 4. connect_failed 连接失败。 ​ 5. error 连接错误。 ​ 6. message 监听服务端 send 的信息。 ​ 7. reconnect_failed 重新连接失败。 ​ 8. reconnect 重新连接成功。 ​ 9. reconnecting 正在重连。

客户端 socket 发起连接时的顺序：

​ 当第一次连接时，事件触发顺序为： connecting → connect；

​ 当失去连接时，事件触发顺序为：disconnect → reconnecting →connecting → reconnect → connect。

传递参数：

​ 传递参数时，我们是不能在 url 中直接拼接的，只能用以下方法传值和接收

​ var socket= io.connect(‘/’,{ query:’sid=123456’ ​ });

​ 在服务端可以这样获取到传递的参数: ​ io.use(function(socket){ ​ var query = socket.request._query; ​ var sid = query.sid; ​ });

​ 客户端传递的参数已经被解析成了一个 json 对象，这个对象就是_query。

本文由 倪建成学习时 编辑，只是普通笔记。若是对你有用，可以自行转载

最后编辑时间为:2019-07-28 00:00:00