WebSocket

WebSocket 是什么？

WebSocket 协议在2008年诞生，2011年成为国际标准。所有浏览器都已经支持了。

WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。

WebSocket协议是基于TCP的一种新的网络协议。它实现了浏览器与服务器全双工(full-duplex)通信——允许服务器主动发送信息给客户端。

它的最大特点就是，服务器可以主动向客户端推送信息，客户端也可以主动向服务器发送信息，是真正的双向平等对话，属于服务器推送技术的一种。

其他特点包括：

（1）建立在 TCP 协议之上，服务器端的实现比较容易。

（2）与 HTTP 协议有着良好的兼容性。默认端口也是80和443，并且握手阶段采用 HTTP 协议，因此握手时不容易屏蔽，能通过各种 HTTP 代理服务器。

（3）数据格式比较轻量，性能开销小，通信高效。

（4）可以发送文本，也可以发送二进制数据。

（5）没有同源限制，客户端可以与任意服务器通信。

（6）协议标识符是ws（如果加密，则为wss），服务器网址就是 URL。

为什么需要 WebSocket ？

了解计算机网络协议的人，应该都知道：HTTP 协议是一种无状态的、无连接的、单向的应用层协议。它采用了请求/响应模型。通信请求只能由客户端发起，服务端对请求做出应答处理。

这种通信模型有一个弊端：HTTP 协议无法实现服务器主动向客户端发起消息。

这种单向请求的特点，注定了如果服务器有连续的状态变化，客户端要获知就非常麻烦。大多数 Web 应用程序将通过频繁的异步JavaScript和XML（AJAX）请求实现长轮询。轮询的效率低，非常浪费资源（因为必须不停连接，或者 HTTP 连接始终打开）。

HTTP 和 WebSocket 有什么区别和关系？

WebSocket是HTML5中的协议，支持持久连接；而Http协议不支持持久连接。

首先HTMl5指的是一系列新的API,或者说新规范，新技术。WebSocket是HTML5中新协议、新API.跟HTTP协议基本没有关系。

一、Socket简介

Socket又称"套接字"，应用程序通常通过"套接字"向网络发出请求或者应答网络请求。Socket的英文原义是“孔”或“插座”，作为UNIX的进程通信机制。Socket可以实现应用程序间网络通信。

Socket可以使用TCP/IP协议或UDP协议。

TCP/IP协议

TCP/IP协议是目前应用最为广泛的协议，是构成Internet国际互联网协议的最为基础的协议,由TCP和IP协议组成:

TCP协议:面向连接的、可靠的、基于字节流的传输层通信协议，负责数据的可靠性传输的问题。

IP协议:用于报文交换网络的一种面向数据的协议，主要负责给每台网络设备一个网络地址，保证数据传输到正确的目的地。

UDP协议

UDP特点：无连接、不可靠、基于报文的传输层协议，优点是发送后不用管，速度比TCP快。

二、WebSocket简介与消息推送

B/S架构的系统多使用HTTP协议，HTTP协议的特点：

1、无状态协议

2、用于通过 Internet 发送请求消息和响应消息

3、使用端口接收和发送消息，默认为80端口，底层通信还是使用Socket完成。

 

实现Web端即时通讯的方法，行为方式上两种通用方法：客户端拉取或服务器；实现即时通讯主要有四种方式，它们大体可以分为两类，一种是在HTTP基础上实现的，包括短轮询、comet和SSE；另一种不是在HTTP基础上实现是，即WebSocket。

轮询（polling）

基本思路就是浏览器每隔一段时间通过 setInterval 定时向浏览器发送http请求，服务器端在收到请求后，不论是否有数据更新，都直接进行响应。

优点：比较简单，易于理解，后端程序编写比较容易。

缺点：请求中有大半是无用，浪费带宽和服务器资源。

实例：适于小型应用。

长轮询（long polling）（comet）

当服务器收到客户端发来的Ajax请求后，服务器端不会直接进行响应，而是先将这个请求挂起，然后判断服务器端数据是否有更新。通常的做法是，在服务器的程序中加入一个死循环，在循环中监测数据的变动。

优点：长轮询和短轮询比起来，明显减少了很多不必要的http请求次数，相比之下节约了资源。

缺点：连接挂起也会导致资源的浪费，返回数据顺序无保证，难于管理维护。

实例：WebQQ、Hi网页版、Facebook IM。

长连接（SSE）

Server-Sent Events（服务器发送事件，简称SSE），SSE 是单向通道，只能服务器向客户端发送消息，如果客户端需要向服务器发送消息，则需要一个新的 HTTP 请求。

在实现上，客户端浏览器中增加EventSource对象，使其能通过事件的方式接收到服务器推送的消息，在服务端，使用长连接的事件流协议，即请求响应时增加新数据流数据格式。SSE最大的特点就是不需要客户端发送请求，可以实现只要服务器端数据有更新，就可以马上发送到客户端。

非常适应于后端数据更新频繁且对实时性要求较高而又不需要客户端向服务端通信的场景下。

优点：消息即时到达，不发无用请求；管理起来也相对便。

缺点：服务器维护一个长连接会增加开销。

实例：Gmail聊天

Websocket

WebSocket是HTML5开始提供的一种浏览器与服务器间进行全双工通讯的网络技术。依靠这种技术可以实现客户端和服务器端的长连接，双向实时通信。

特点：事件驱动、异步、使用ws或者wss协议的客户端socket，能够实现真正意义上的推送功能

缺点：少部分浏览器不支持，浏览器支持的程度与方式有区别。

从兼容性角度考虑，短轮询>长轮询>长连接SSE>WebSocket；

从性能方面考虑，WebSocket>长连接SSE>长轮询>短轮询。

三、WebSocket客户端

websocket允许通过JavaScript建立与远程服务器的连接，从而实现客户端与服务器间双向的通信。

在websocket中有两个方法

1、send() 向远程服务器发送数据

2、close() 关闭该websocket链接

websocket同时还定义了几个监听函数

1、onopen 当网络连接建立时触发该事件

2、onerror 当网络发生错误时触发该事件

3、onclose 当websocket被关闭时触发该事件

4、onmessage 当websocket接收到服务器发来的消息的时触发的事件，也是通信中最重要的一个监听事件。msg.data

websocket还定义了一个readyState属性，这个属性可以返回websocket所处的状态

1、CONNECTING(0) websocket正尝试与服务器建立连接

2、OPEN(1) websocket与服务器已经建立连接

3、CLOSING(2) websocket正在关闭与服务器的连接

4、CLOSED(3) websocket已经关闭了与服务器的连接

websocket的url开头是ws，如果需要ssl加密可以使用wss，当我们调用websocket的构造方法构建一个websocket对象（new WebSocket(url)）的之后，就可以进行即时通信了。

 

更多分享请访问博客 海马搜索 www.hmsou.com 

 

参考文章：

1、http://www.runoob.com/html/html5-websocket.html

2、http://www.ruanyifeng.com/blog/2017/05/websocket.html

3、https://www.cnblogs.com/jingmoxukong/p/7755643.html