柚子快报邀请码778899分享：WebSocket详解-02
一、背景
Websocket是html5提出的一个协议规范，是为解决客户端与服务端实时通信。 WebSocket在连接关闭时会触发onclose事件, 在连接异常时会触发onerror事件。但在弱网环境下, 它们的触发灵敏度不高, 往往延迟很久才触发, 前端再去进行重连操作, 这样很不友好。
本文将介绍使用心跳重连机制来改善这一问题。
二、原理
心跳重连机制：前端在WS连接成功的情况下，开始执行心跳函数，首先向服务器端发送ping信息, 服务器内若收到信息则会返回pong信息。在一定时间内, 前端收到服务器返回的信息, 则表示此连接是正常的, 便重置心跳函数; 若前端在一定时间内没有收到心跳函数, 则表明没有连接成功, 此时前端关闭ws, 再执行重连操作。
三、代码
Websocket心跳检测
四、Stomp介绍
概念：面向消息的简单文本协议
websocket定义了两种传输信息类型:文本信息和二进制信息。类型虽然被确定，但是他们的传输体是没有规定的。所以，需要用一种简单的文本传输类型来规定传输内容，它可以作为通讯中的文本传输协议。
STOMP是基于帧的协议，客户端和服务器使用STOMP帧流通讯。
一个STOMP客户端是一个可以以两种模式运行的用户代理，可能是同时运行两种模式。
作为生产者，通过SEND框架将消息发送给服务器的某个服务。
作为消费者，通过SUBSCRIBE制定一个目标服务，通过MESSAGE框架，从服务器接收消息。
五、Stomp常用代码
// 发送消息
stompClient.send('/topic/terminal_chart', {}, "ping")
// 订阅（subscription是一个对象，包含一个id属性，对应这个这个客户端的订阅ID）
var subscription = client.subscribe("/queue/test", callback);
// 终止订阅消息
subscription.unsubscribe();
// 获取STOMP子协议的客户端对象
stompClient = Stomp.over(socket);
// 心跳发送频率
stompClient.heartbeat.outgoing = 20000;
// 心跳接收频率
stompClient.heartbeat.incoming = 20000;
// 调用.connect方法连接Stomp服务端进行验证
stompClient.connect({}, ()=>{
// 成功回调
}, ()=>{
// 失败回调（第一次连接失败和连接后断开连接都会调用这个函数）
})
// 判断是否连接
stompClient.connected
六、Stomp自带心跳机制
stomp默认的心跳为10000ms, heartbeat.outgoing:客户端发给服务端的心跳，* 0表示它不能发送心跳 * 否则它是能保证两次心跳的最小毫秒数 heartbeat.incoming：客户端希望服务端发送的心跳。* 0表示它不想接收心跳 * 否则它表示两次心跳期望的毫秒数 CONNECT heart-beat:
CONNECTED: heart-beat:
七、Stomp手写心跳检测
如果服务端禁止接收心跳，则stomp自带心跳机制将不起作用，如下手写的代替。
柚子快报邀请码778899分享：WebSocket详解-02
精彩内容
发表评论