websocket

在单个 TCP 连接上进行全双工通讯的协议。允许服务端主动向客户端推送数据。
在 WebSocket API 中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。
获取 Web Socket 连接后，你可以通过 send() 方法来向服务器发送数据，并通过 onmessage 事件来接收服务器返回的数据。

创建连接的过程：
    客户端浏览器首先要向服务器发起一个 HTTP 请求，这个请求和通常的 HTTP 请求不同，包含了一些附加头信息，
    其中附加头信息"Upgrade: WebSocket"表明这是一个申请协议升级的 HTTP 请求，服务器端解析这些附加的头信息然后产生应答信息返回给客户端，
    客户端和服务器端的 WebSocket 连接就建立起来了，双方就可以通过这个连接通道自由的传递信息，
    并且这个连接会持续存在直到客户端或者服务器端的某一方主动的关闭连接。
    附加头消息中Connection 必须设置 Upgrade，表示客户端希望连接升级。Upgrade 字段必须设置 Websocket，表示希望升级到 Websocket 协议。

var Socket = new WebSocket(url, [protocol] )
第一个参数 url, 指定连接的 URL。第二个参数 protocol 是可选的，指定了可接受的子协议。

创建Socket对象后即可读取Socket对象的属性：
    Socket.readyState ：
        只读属性 readyState 表示连接状态
            0 - 表示连接尚未建立。
            1 - 表示连接已建立，可以进行通信。
            2 - 表示连接正在进行关闭。
            3 - 表示连接已经关闭或者连接不能打开。
    Socket.bufferedAmount：
        只读属性 bufferedAmount 已被 send() 放入正在队列中等待传输，但是还没有发出的 UTF-8 文本字节数。
        
创建Socket对象后即可指定Socket对象的监听事件：
    open：
        Socket.onopen = (e) => {...}     连接建立时触发  可以指定回调函数
    message：
        Socket.onmessage = (e) => {...}    客户端接收服务端数据时触发  e.data为接受到服务器回传的数据
    error：
        Socket.onerror = (e) => {...}    通信发生错误时触发
    close：
        Socket.onclose = (e) => {...}     连接关闭时触发
        
创建Socket对象即可调用Socket对象的方法：
    Socket.send()     使用连接发送数据
    Socket.close()     关闭连接

目前普遍浏览器都是支持websocket的接口，判断浏览器是否支持的方法：
    if ('WebSocket' in window) {
        alert('支持')
    }

vue框架下的实例：
	<template>
		<div class="test"></div>
	</template>

	<script>
		export default {
			name: 'test',
			data() {
				return {
					websock: null,
				}
			},
			created() {
				this.initWebSocket();
			},
			destroyed() {
				this.websock.close() //离开路由之后断开websocket连接
			},    
			methods: {
				initWebSocket(){ // 初始化weosocket
					const wsuri = "ws://123.207.167.163:9010/ajaxchattest"
					this.websock = new WebSocket(wsuri)
					this.websock.onmessage = this.websocketonmessage
					this.websock.onopen = this.websocketonopen
					this.websock.onerror = this.websocketonerror
					this.websock.onclose = this.websocketclose
				},
				websocketonopen(){ // 连接建立之后执行send方法发送数据
					let actions = {"test":"12345"}
					this.websocketsend(JSON.stringify(actions))
				},
				websocketonerror(){ // 连接建立失败重连
					this.initWebSocket()
				},
				websocketonmessage(e){ // 数据接收
					const redata = JSON.parse(e.data)
					alert('数据接收：' + e.data)
				},
				websocketsend(Data){ // 数据发送
					this.websock.send(Data)
					alert('数据发送：' + Data)
				},
				websocketclose(e){ // 关闭
					console.log('断开连接',e)
				},
			},
		}
	</script>
	<style lang='less'>
	</style>