websocke前世今生

Posted 2020-10-02

注：以下内容来自网上。本人经过加工整理。

1、问什么要用websocke？

Browser已经支持http协议，为什么还要开发一种新的WebSocket协议呢？我们知道http协议是一种单向的网络协议。在建立连接后，它仅仅同意Browser/UA（UserAgent）向WebServer发出请求资源后。WebServer才干返回对应的数据。而WebServer不能主动的推送数据给Browser/UA，当初这么设计http协议也是有原因的。如果WebServer能主动的推送数据给Browser/UA，那Browser/UA就太easy受到攻击，一些广告商也会主动的把一些广告信息在不经意间强行的传输给client，这不能不说是一个灾难。那么单向的http协议给如今的站点或Web应用程序开发带来了哪些问题呢？

在http协议上要实现browser获取server端实时数据的需求(比如：股票实时交易)。往往使用下面两种方案：

1）polling

这样的方式就是通过Browser/UA定时的向Webserver发送http的Get请求，server收到请求后，就把最新的数据发回给client（Browser/UA），Browser/UA得到数据后。就将其显示出来，然后再定期的反复这一过程。尽管这样能够满足需求。可是也仍然存在一些问题，比如在某段时间内Webserver端没有更新的数据，可是Browser/UA仍然须要定时的发送Get请求过来询问。那么Webserver就把曾经的老数据再传送过来。Browser/UA把这些没有变化的数据再显示出来，这样显然既浪费了网络带宽，又浪费了CPU的利用率。假设说把Browser发送Get请求的周期调大一些。就能够缓解这一问题，可是假设在Webserver端的数据更新非常快时，这样又不能保证Web应用程序获取数据的实时性。

2）long polling

它是对Polling的一种改进。

Browser/UA发送Get请求到Webserver，这时Webserver能够做两件事情，第一，假设server端有新的数据须要传送，就马上把数据发回给Browser/UA，Browser/UA收到数据后。马上再发送Get请求给Web Server。第二，假设server端没有新的数据须要发送。这里与Polling方法不同的是，server不是马上发送回应给Browser/UA。而是把这个请求保持住，等待有新的数据到来时，再来响应这个请求。当然了。假设server的数据长期没有更新，一段时间后。这个Get请求就会超时，Browser/UA收到超时消息后。再马上发送一个新的Get请求给server。然后依次循环这个过程。

这种方式尽管在某种程度上减小了网络带宽和CPU利用率等问题。可是仍然存在缺陷，比如如果server端的数据更新速率较快。server在传送一个数据包给Browser后必须等待Browser的下一个Get请求到来，才干传递第二个更新的数据包给Browser，那么这种话，Browser显示实时数据最快的时间为2×RTT（往返时间），另外在网络拥塞的情况下，这个应该是不能让用户接受的。

另外，因为http数据包的头部数据量往往非常大（通常有400多个字节），可是真正被server须要的数据却非常少（有时仅仅有10个字节左右），这种数据包在网络上周期性的传输，难免对网络带宽是一种浪费。

2、webSocket协议简单介绍

WebSocket协议是一种双向通信协议。它建立在TCP之上，同http一样通过TCP来数据传输。可是它和http最大的不同有两点：

1.WebSocket是一种双向通信协议，在建立连接后，WebSocketserver和Browser/UA都能主动的向对方发送或接收数据，就像Socket一样。不同的是WebSocket是一种建立在Web基础上的一种简单模拟Socket的协议。

2.WebSocket须要通过握手连接。类似于TCP它也须要client和server端进行握手连接，连接成功后才干相互通信。

这里简单说明一下WebSocket握手的过程：

当Web应用程序调用new WebSocket(url)接口时，Browser就開始了与地址为url的WebServer建立握手连接的过程。

1.    Browser与WebSocketserver通过TCP三次握手建立连接，假设这个建立连接失败，那么后面的过程就不会运行。Web应用程序将收到错误消息通知。

2.     在TCP建立连接成功后，Browser/UA通过http协议传送WebSocket支持的版本。协议的字版本，原始地址，主机地址等等一些列字段给server端。

<span style="font-family:Comic Sans MS;">GET /chat HTTP/1.1  
Host: server.example.com  
Upgrade: websocket  
Connection: Upgrade  
Sec-WebSocket-Key:dGhlIHNhbXBsZSBub25jZQ==  
Origin: http://example.com  
Sec-WebSocket-Protocol: chat,superchat  
Sec-WebSocket-Version: 13  </span>

3.     WebSocketserver收到Browser/UA发送来的握手请求后，假设数据包数据和格式正确，client和server端的协议版本匹配等等，就接受本次握手连接，并给出对应的数据回复。相同回复的数据包也是採用http协议传输。

<span style="font-family:Comic Sans MS;">HTTP/1.1 101 Switching Protocols  
Upgrade: websocket  
Connection: Upgrade  
Sec-WebSocket-Accept:s3pPLMBiTxaQ9kYGzzhZRbK+xOo=  
Sec-WebSocket-Protocol: chat  </span>

4.     Browser收到server回复的数据包后。假设数据包内容、格式都没有问题的话，就表示本次连接成功，触发onopen消息，此时Web开发人员就能够在此时通过send接口想server发送数据。否则，握手连接失败，Web应用程序会收到onerror消息，而且能知道连接失败的原因。

3、websocke和http关系：

WebSocket与http协议一样都是基于TCP的，所以他们都是可靠的协议，Web开发人员调用的WebSocket的send函数在browser的实现中终于都是通过TCP的系统接口进行传输的。

WebSocket和Http协议一样都属于应用层的协议，那么他们之间有没有什么关系呢？答案是肯定的，WebSocket在建立握手连接时。数据是通过http协议传输的。正如我们上一节所示“GET/chat HTTP/1.1”，这里面用到的仅仅是http协议一些简单的字段。可是在建立连接之后，真正的传输数据阶段是不须要http协议參与的。

4、websocke浏览器端的api：

<span style="font-family:Comic Sans MS;">var wsServer = 'ws://localhost:8888/Demo'; //server地址，这里是ws开头。假设是安全websocke使用wss
var websocket = new WebSocket(wsServer); //创建WebSocket对象  
websocket.send("hello");//向server发送消息  
alert(websocket.readyState);//查看websocket当前状态  
websocket.onopen = function (evt) {  
//已经建立连接  
};  
websocket.onclose = function (evt) {  
//已经关闭连接  
};  
websocket.onmessage = function (evt) {  
//收到server消息，使用evt.data提取  
};  
websocket.onerror = function (evt) {  
//产生异常  
};  </span>

5、wbsocke服务端api说明：

由于WebSocket是一种通讯协议，须要在client（浏览器已经帮我们实现）和server端都实现该协议才干完毕WebSocket的通信。所以server端须要借助一些lib包实现。

tomcat7中websocket的消息格式：

详细能够參照tomcat7下对websocket的支持返利：http://www.aiuxian.com/article/p-228470.html