关于长连接的使用

        本次项目我尝试了使用长连接，先说一下长连接的作用吧，以前我们从数据库获取数据是只有我们前端触发某一事件去发请求，后端才会返回数据，也就是说必须有人为操作才能完成这一过程，但是对于websocket长连接来说，实现了前后端牵手，使得发送请求与获取数据变成一种自动的行为，最常见的就是我们平时的聊天软件，消息的发送与接收是实时的，也许有的人会使用轮询来实现消息的实时，但是相比于长连接，轮询太过浪费资源，每个特定的时间就会发送请求，但有时数据并没有变化，再去请求岂不是一种浪费，而长连接则可以根据数据的变化去发送请求，所以长连接对于实时消息的实现是一种好方法。

        学习过程中发现，网上的教学视频都只是说这边发消息，那边接收消息，用sessionstorage暂存历史记录，但是项目中是需要保存历史记录的，所以，可以然后端写一个接口来保存历史记录，再写一个获取，然后通过以下方面进行长连接的操作：

var websocket = null;
//判断当前浏览器是否支持WebSocket
if('WebSocket' in window){
  websocket = new WebSocket("这里是后端给前端的长链接的连接");
}else{
   alert('网络错误')
}

//连接发生错误的回调方法
websocket.onerror = function(){
  alert("网络错误");
};

//连接成功建立的回调方法
websocket.onopen = function(event){
  console.log("连接成功~");
}

//接收到消息的回调方法
websocket.onmessage = function(event){
  这里是接受到新消息的处理
}

//连接关闭的回调方法
websocket.onclose = function(){
  console.log("close");
}

//监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，
// 防止连接还没断开就关闭窗口，server端会抛异常。
window.onbeforeunload = function(){
  websocket.close();
}


//关闭连接
function closeWebSocket(){
  websocket.close();
}

以上都是基础操作，只需记住便可，接下来就说一下我实现实时消息的过程，众所周知，长连接是需要前后端配合的，后端需要进行相关的配置，给前端长连接的地址，对于前端，当用户有新消息的时候可以使用websocket.send()的方法，同时调用接口储存消息 ，websocket.send()相当于告知onmessage方法可以执行了，如果需要渲染数据，就可以在onmessage中调用接口进行操作了。

        使用websocket最重要的是前后端的配合，前端部分相对简单，但也需要前后端及时沟通，了解需求，才能发挥好他的优点。