121. websocket网络层面底层原理

[goldEli]

先来看看为什么需要 websocket？

传统的 http 通信方式是单向的，服务器不能主动向浏览器发送消息，必须从浏览器发起，这样设计很大原因是为了安全，避免用户在不知情的情况下接收到服务器的消息。

但随着浏览器应用越来越复杂，单向通信无法满足当前需求，比如聊天，游戏等应用。

当然可以封装 http 请求实现双向通信（长连接）：

function poll() {
  setTimeout(() => {
    $.ajax({
      url: "xxxxxx",
      success: data => {
        // do something with data
        // ...

        // setup next poll recursively
        poll()
      }
    })
  }, 1000)
}

但这不是真正意义的长连接，会有很高的延迟，无法满足低延迟引用的需求，比如多人的第一人称射击游戏。websocket 应运而生。

Websocket

Websocket 在浏览器和服务器之间建立了一个 socket 连接，也就是一个长连接，两边都可以在任何时候给对方发消息。

socket 连接的建立也是通过一个普通的 http 请求：

GET /chat HTTP/1.1
Host: server.example.com
Upgrade: websocket
Connection: Upgrade
Origin: http://example.com

区别在于多了两个属性，告诉浏览器我要建立长连接。

Upgrade: websocket
Connection: Upgrade

服务器返回：

HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade

这样一个长连接就建立完成了。

Reference

• How JavaScript works: Deep dive into WebSockets and HTTP/2 with SSE + how to pick the right path
• WebSocket 教程
• WebSocket 是什么原理？为什么可以实现持久连接？

[zlx362211854]

websocket 是基于TCP协议的双全工通讯协议，WebSocket通信协议于2011年被IETF定为标准。 所以它的基础还是基于TCP的协议，只不过，它是双全工的通讯方式，双全工即通讯是双向的并且同时的，即A-B通讯的同时也能进行B-A的通讯，并且一次建立连接可保持连接的持久性。所以它有着高效的通讯效率以及即时性，被广泛用在即时通讯领域。