WebSocket 是 HTML5 下一种新的协议。它实现了浏览器与服务器全双工通信，能更好的节省服务器资源和带宽并达到实时通讯的目的。它与HTTP一样通过已建立的TCP连接来传输数据，但是它和HTTP最大不同是:

• WebSocket是一种双向通信协议。在建立连接后，WebSocket服务器端和客户端都能主动向对方发送或接收数据，就像Socket一样；
• WebSocket需要像TCP一样，先建立连接，连接成功后才能相互通信。

WebSocket 连接本质上是一个 TCP 连接,比较轮询在数据传输的稳定性和数据传输量的大小方面，具有很大的性能优势。

浏览器请求

GET / HTTP/1.1Upgrade: websocketConnection: UpgradeHost: example.comOrigin: nullSec-WebSocket-Key: sN9cRrP/n9NdMgdcy2VJFQ==Sec-WebSocket-Version: 13

客户端发起的WebSocket连接报文类似传统HTTP报文，Upgrade：websocket参数值表明这是WebSocket类型请求，Sec-WebSocket-Key是WebSocket客户端发送的一个 base64编码的密文，要求服务端必须返回一个对应加密的Sec-WebSocket-Accept应答，否则客户端会抛出Error during WebSocket handshake错误，并关闭连接。

在请求中的Sec-WebSocket-Key是随机的，服务器端会用这些数据来构造出一个SHA-1的信息摘要。把Sec-WebSocket-Key加上一个魔幻字符串258EAFA5-E914-47DA-95CA-C5AB0DC85B11。使用 SHA-1 加密，之后进行 BASE-64编码，将结果作为 Sec-WebSocket-Accept 头的值，返回给客户端；WebSocket 先是通过 HTTP 建立连接, 然后通过 101 状态码, 表示切换协议,在配置里是 Upgrade。

服务器回应

HTTP/1.1 101 Switching ProtocolsUpgrade: websocketConnection: UpgradeSec-WebSocket-Accept: fFBooB7FAkLlXgRSz0BT3v4hq5s=Sec-WebSocket-Origin: nullSec-WebSocket-Location: ws://example.com/

Sec-WebSocket-Accept 的值是服务端采用与客户端一致的密钥计算出来后返回客户端的，HTTP/1.1 101 Switching Protocols表示服务端接受WebSocket协议的客户端连接，经过这样的请求-响应处理后，两端的WebSocket连接握手成功, 后续就可以进行TCP通讯了。用户可以查阅了解WebSocket客户端和服务端更详细的交互数据格式。

浏览器兼容性

最新的主流浏览器对WebSocket支持良好：

• Chrome 4+
• Firefox 4+
• Internet Explorer 10+
• Opera 10+
• Safari 5+

我们在阿里云启用全站 HTTPS 后，我们发现阿里云 webscoket 通信报错 400 Bad Request 错误，开始以为是启用HTTPS的问题，后面发现阿里云的负载均衡(LB)根本就不支持 ws 协议（），Google 了一番，决定使用 nginx 代理。

备注：阿里 ws 与 http2 支持情况 https://yq.aliyun.com/articles/277584?spm=5176.10695662.1996646101.searchclickresult.2a8d761c2PJag1

Request URL:wss://singalr.xxx.cn/signalr/connect?transport=webSockets&clientProtocol=1.5&connectionToken=xmpmOB19Q6d7X32GFEP7lTFm7DPSJIcRALZOxbASrpogN5MPTTBafipQsNBs0x5J7wvUm5QI8e1iViqETc9Q8%2FGHCLZo5GhJsXYRWmOzsICh5LDyQDGnAsRSC3GvBMsQ&connectionData=%5B%7B%22name%22%3A%22signalrpushhub%22%7D%5D&tid=9Request Method:GETStatus Code:400 Bad RequestResponse HeadersAccess-Control-Allow-Credentials:trueAccess-Control-Allow-Origin:https://xxx.cnCache-Control:no-cacheConnection:keep-aliveContent-Type:text/htmlDate:Wed, 17 May 2017 02:09:56 GMTExpires:-1Pragma:no-cacheTransfer-Encoding:chunkedX-AspNet-Version:4.0.30319X-Content-Type-Options:nosniffX-Powered-By:ASP.NETResponse HeadersAccept-Encoding:gzip, deflate, sdch, brAccept-Language:zh-CN,zh;q=0.8Cache-Control:no-cacheConnection:UpgradeCookie:_pms_session=5d0gqrezzfgvivj2b4oaecy3; acw_tc=AQAAAMvoFF/VeQoAJkNKfD0idg5CQvGLHost:singalr.xxx.cnOrigin:https://p2.xxx.cnPragma:no-cacheSec-WebSocket-Extensions:permessage-deflate; client_max_window_bitsSec-WebSocket-Key:V2NZvyJw/CJtAdn68xDZWA==Sec-WebSocket-Version:13Upgrade:websocketUser-Agent:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.96 Safari/537.36Query String Parameterstransport:webSocketsclientProtocol:1.5connectionToken:xmpmOB19Q6d7X32GFEP7lTFm7DPSJIcRALZOxbASrpogN5MPTTBafipQsNBs0x5J7wvUm5QI8e1iViqETc9Q8/GHCLZo5GhJsXYRWmOzsICh5LDyQDGnAsRSC3GvBMsQconnectionData:[{
    "name":"signalrpushhub"}]tid:9

WebSocket 的 Nginx 配置

 开始以为是 HTTPS 443 监听的问题，后面修发现HTTP下ws协议也不可以，咨询了一番，最后发现是阿里云负载均衡不支持 ws 协议的问题。单独把 signalr 的服务端使用 nginx 代理负载 ，其他服务器还是使用阿里云的负载

upstream singalr {    server 192.168.1.5;   server 192.168.1.4; }server {    listen       443 ssl;    server_name  singalr.com;     #charset koi8-r;     #access_log logs/host.access.log main;    ssl on;    ssl_certificate /etc/ssl/private/xxxx.pem;    ssl_certificate_key /etc/ssl/private/xxx.key;        location / {         proxy_pass http://singalr;        proxy_redirect    off;        proxy_set_header X-Real-IP $remote_addr;        proxy_set_header Host $host;        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;        proxy_http_version 1.1;        proxy_set_header Upgrade $http_upgrade;        proxy_set_header Connection "upgrade";    }}

REFER:

WebSocket 实现原理