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

WebSocket 使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在 WebSocket API 中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。

在 WebSocket API 中，浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。

现在，很多网站为了实现推送技术，所用的技术都是 Ajax 轮询。轮询是在特定的的时间间隔（如每1秒），由浏览器对服务器发出HTTP请求，然后由服务器返回最新的数据给客户端的浏览器。这种传统的模式带来很明显的缺点，即浏览器需要不断的向服务器发出请求，然而HTTP请求可能包含较长的头部，其中真正有效的数据可能只是很小的一部分，显然这样会浪费很多的带宽等资源。

HTML5 定义的 WebSocket 协议，能更好的节省服务器资源和带宽，并且能够更实时地进行通讯。

http：只能由客户端发起，不能做到服务器主动向客户端推送消息 

WebSocket：服务器可以主动向客户端推送信息，客户端也可以主动向服务器发送信息，是真正的双向对话

1.创建WebSocket实例
url：url之前需添加ws://（未加密）或wss://（已加密），类似http://、https://
protocol：与服务端定义的协议名称相同，协议的参数例如XMPP（Extensible Messaging and Presence Protocol）、SOAP（Simple Object Access Protocol）或者自定义协议。

var ws = new WebSocket('ws://url');
var ws1 = new WebSocket('ws://url', 'myprotocol');
var ws2 = new WebSocket('ws://url', ['protocol_1','protovol_2']);

2.属性

①readyState属性：WebSocket当前连接状态

通过 ws.readyState属性查看当前连接状态

②bufferedAmount：检查传输数据的大小，当客户端传输大量数据时使用避免网络饱和

通过ws.bufferedAmount属性查看传输数据的大小

③protocol：在构造函数中使用，protocol参数让服务端知道客户端使用的WebSocket协议。而WebSocket对象的这个属性就是指的最终服务端确定下来的协议名称，可以为空

3.WebSocket 对象的相关事件

      //连接成功后的回调函数ws.onopen = function() {console.log("服务器已连接");};//收到服务器数据后的回调函数ws.onmessage = function(msg) {console.log("来自服务器端的数据：" + msg.data);};//报错时的回调函数ws.onerror = function(event) {console.log(event, "event");};//连接关闭后的回调函数ws.onclose = function() {console.log("服务器关闭");};

4.WebSocket 对象的相关方法

      //使用连接发送数据ws.send("your message");//关闭连接ws.onclose = function() {console.log("服务器关闭");};