Web Socket 是什么？
HTML5开始提供的一种浏览器与服务器进行全双工通讯的网络技术，属于应用层协议。它基于TCP传输协议，并复用HTTP的握手通道。
为什么需要Web Socket
因为其他方法非常的消耗资源，例如ajax轮询，Web Socket就是为了解决这个问题而出现的。
Web Socket的使用过程
原理之类的楼主就不说了，下面讲讲我项目中使用的过程和心得，是怎么一步一步使用聊天的。（讲的不好勿喷，楼主是刚工作几个月的前端萌新O(∩_∩)O，有讲错的请评论指点，谢谢）
连接web Socket的方法
简要描述：
连接websocket接口 发送信息给其他用户之前，必须要先连接上websocket。否者你接收不到别人发给你的消息。
连接请求的url地址
说明：
连接上websocket第一时间需要进行登录。登录的方法是，发送用户的token过来。
构造以下的json字符串，通过websocket发送给服务器，即可。
假设当前用户的token是1212121，发送内容如下：
'{"type":"login","identity":"user","token":"1212121"}';
注意
服务器会定时发送{"type":"ping"}过来，接收到回复：{"type":"pong"}就可以， 一定要回复，不然服务器会断开连接，注意注意注意。
Pings和Pongs：WebSockets的心跳 在经过握手之后的任意时刻里，无论客户端还是服务端都可以选择发送一个ping给另一方。 当ping消息收到的时候，接受的一方必须尽快回复一个pong消息。 例如，可以使用这种方式来确保客户端还是连接状态。
websocket代码示例
var ws = new WebSocket("请求url");
ws.onopen = function () { //上面说了连接上第一时间要登陆
var msg = '{"type":"login","identity":"user","token":"2323422"}';
ws.send(msg); // 发送消息给服务器
};
ws.onmessage = function (evt) { //其他用户发送过来的消息会立即进入这个函数
var data = JSON.parse(evt.data);
if (data.type && data.type == "ping") {
ws.send('{"type":"pong"}'); //发送消息给服务器
} else { //其他情况，那就是其他用户发过来的东西
console.log(evt.data)
}
};
ws.onclose = function(evt) //监听关闭
{
console.log("WebSocketClosed!");
};
ws.onerror = function(evt)//监听报错
{
console.log("WebSocketError!");
};
如果有拿不到token的情况，可以登陆成功之后进行以下处理。监听关闭之后再重新连接
// 关闭了重新连接
ws.onClose(res =>{
var ws = new WebSocket("请求url");
})
// 例如（登陆之后到index界面）
// 在index界面把 Web Socket 关闭即可
ws.close() // 把Web Socket 关闭，让它重新连接
聊天界面
比如聊天界面是news界面 所有其他人发过来的消息都会被onmessage接收到，
在else里面进行处理，把其他人的消息发过来并push到数组里面重新渲染界面即可，这样就实现了实时聊天.
//news
ws.onmessage = function (evt) { //其他用户发送过来的消息会立即进入这个函数
var data = JSON.parse(evt.data);
if (data.type && data.type == "ping") {
ws.send('{"type":"pong"}');
} else { //其他情况，那就是其他用户发过来的东西
console.log(evt.data) // 在这里进行处理
}
};
发消息给别人的话需要后台的帮助，很简单，这里就不多说明了。
那么这篇文章就结束啦，谢谢各位的观看。
ps：记录自己的学习路程O(∩_∩)O。
