websocket协议小知识

163 阅读3分钟

1. websocket协议历史

           http轮询分为轮询和长轮询图示

image.png websocket之前,若需要在客户端和服务器之间双向通信,需要通过HTTP轮询来实现。

1. **轮询**:指的是浏览器通过js开启一个定时器,浏览器以固定的时间间隔发送请求给服务器,询问服务器是否有新消息。
- 轮询的缺点:实时性不够;频繁的请求也会给服务器带来极大的压力
2. **长轮询**:指的是浏览器发送一个请求给服务器时,服务器先搁置一段时在处理(有消息了再回复),它可以解决实时性问题。
- 缺点:浪费服务器资源(多线程模式运行的服务器会让大部分线程大部分时间都处于挂起状态);HTTP连接在长时间没有数据传输时,链路上的任一网关可能关闭这个连接,而网关无法控制;

所以,在HTML5中,新增了websocket协议,能够在浏览器和服务器之间建立一个不受限的双向通信通道。

敲重点:为什么websocket连接可以实现全双工通信而http连接不可以???

分为两点赘述:
1.  http协议是建立在tcp协议之上的,tcp协议本身就实现了全双工通信,但是,http协议的请求-应答机制限制了全双工通信  ;
2.  websocket连接建立后,相当于简单规定了,接下来的通信协议,不使用http协议了,直接互相发数据吧~

websocket协议: 使用ws或wss的URI,其中wss表示使用了TLS的websocket;

ws:// 数据不加密
wss:// 基于TLS的websocket,传输安全层在发送方对数据进行了加密,在接收方进行解密

websocket协议优点:

1. 较少的控制开销
2. 更强的实时性:因为协议是全双工的,服务器可以随时主动给客户端下发数据;
3. 保持连接状态:websocket需要先创建连接,这就使得它成为一种有状态的协议,通信时可以省略部分状态信息;
4. 更好的二进制支持:websocket定义了二进制帧
5. 可以支持扩展:websocket定义了扩展,用户可扩展协议,实现部分自定义的子协议;
  • http 通过判断 header 中是否包含 Connection: Upgrade 与 Upgrade: websocket 来判断当前是否需要升级到 websocket 协议;
  • 除此之外,还有其它 header;
  • 当服务器同意 WebSocket 连接时,返回响应码 101
  • 它的 API 很简单

websocket协议建立后还要干什么?

一旦socket协议建立后,应该监听socket上的事件,一共有4个:
    open:连接已建立;
    message:接收到数据;
    error:websocket错误;
    close:连接已关闭;
    

常用操作: 发送消息:socket.send(data); 关闭连接:socket([code],[reason]);

参考:

- WebSocket:https://www.liaoxuefeng.com/wiki/1022910821149312/1103303693824096

- WebSocket:https://zh.javascript.info/websocket

- 你不知道的 WebSocket:https://juejin.cn/post/6854573221241421838
- 三分钟学前端-微信公众号