轮循监听 & websocket

895 阅读2分钟

Ajax轮询

设置定时器 setInterval() 让浏览器每隔几秒就发送一次请求,询问服务器是否有新的信息。也就是说,客户端发起连接后,如果没有消息,就一直不返回response给客户端,直到有消息才返回,客户端再次建立连接,周而复始(太过被动,服务器不能主动联系客户端,只能由客户端发起)

WebSocket

当服务器完成协议升级后(HTTP-WebSocket), 服务端就可以主动推送消息给客户端,只需要经过一次HTTP请求,就可以做到源源不断的信息传送,这样的协议就解决了上面同步有延迟,而且还非常消耗资源的这种情况

WebSocket的事件触发机制

WebSocket编程遵循异步编程模式,也就是说只要WebSocket连接打开,应用程序就简单的监听事件,客户端不需要主动轮询服务器得到信息,要开始监听事件,只要为WebSocket对象添加回调函数,也可以使用addEventListener()DOM方法为WebSocket对象添加事件监听器

WebSocket对象4个不同的事件

open

一旦服务器建立了WebSocket连接请求,open事件触发并建立一个连接,open事件对应的回调函数称作onopen,到open事件触发时,协议握手完成,WebSocket已经准备好发送和接受数据。如果应用程序接收到一个open事件,那么可以确定WebSocket服务器成功处理了连接请求,并同意与应用程序通信。websocket.onopen() => {}

message

message 事件在接受消息时触发,该事件的回调函数是onmessage

error

error事件在响应意外故障时触发,与该事件对应的回调函数是onerror,错误还是导致WebSocket关闭,接收一个error事件,可以预期很快就会触发close事件,close事件中的代码和原因有可能会返回错误的根源,error事件处理程序是服务器重新连接逻辑以及处理来自WebSocket对象异常的最近位置

close

close事件在WebSocket连接关闭时触发,对应于close事件函数是onclose,一旦连接关闭,客户端和服务器不再能接收或者发送信息。 close有三个属性 可以进行错误处理与恢复,wasClean,code,error。

wasClean 属性是一个布尔属性,表示连接是否顺利关闭,如果WebSocket的关闭时对来自服务器的一个close帧的响应,则该属性为true,如果连接是因为其他原因关闭,则该属性为false,code和error属性表示服务器发送的关闭握手状态,这些属性和WebSocket.close()方法中的code和error一致