WebSocket

1、概念：

　　WebSocket时H5提供的一种在单个TCP连接上进行全双工通讯的协议，它使得客户端和服务器之间的数据交互变得更加简单，允许服务端主动向客户端推送数据。本质上是一个Http协议。

　　在WebSocket API中，浏览器和服务器只需完成一次握手，两者之间就直接可以创建持久性连接，并进行双向数据传输。

2、应用场景：

　　适用于数据实时性要求比较高的场景。

　　传统实现方式：Ajax轮询，即每特定时间间隔由浏览器向服务器发送http请求，服务器响应请求然后发送数据

3、优点：

　　节省服务器资源和款单，且能更实时地通讯。

4、连接过程：

　　浏览器通过js向服务器发出建立WebSocket连接地请求，连接建立以后，客户端和服务端就可以通过TCP连接直接交换数据。当客户端获取WebSocket连接后，就可以通过send()方法向服务器发送数据，并通过onmessage事件来接收服务器返回的数据。

　　为了建立一个WebSocket连接，客户端浏览器首先要向服务端发起一个http请求，这个请求包含了一些附加头信息，例如”Upgrade:WebSocket“等表示这是一个盛情协议升级的请求，服务端解析这些头信息然后产生应答信息返回给客户端，客户端和服务端的WebSocket连接就建立起来了。双方可通过这个连接通道自由传输信息，且此链接会持续存在直到某一方主动关闭。

5、WebSocket对象

（1）创建对象：

var socket = new WebSocket(url,[protocol])

　　url是要连接请求的地址，protocol是可选的参数，表示可接受的子协议。

（2）属性：

• socket.readyState：表示连接状态
  • 0：表示尚未建立连接
  • 1：表示连接已建立，可以进行通信
  • 2：表示连接正在关闭
  • 3：表示连接已关闭或不能打开连接
• socket.bufferAmount：只读属性，表示已被send()放入队列中等待传输，但还未发出utf8文本字节数

（3）WebSocket事件

• socket.send()：使用连接发送数据
• socket.close()：关闭连接

6、使用方法：

//url格式跟普通http请求url不同，是以ws://开头
var ws = new WebSocket("ws://localhost:8080/test");

ws.open = function(){
　　ws.send("数据发送中");
}

ws.onmessage = function(res){
　　//res.data
}

ws.onclose = function(){
　　console.log('连接已关闭')
}