首页 > 语言 > JavaScript > 正文

小程序websocket心跳库(websocket-heartbeat-miniprogram)

2024-05-06 15:44:46
字体:
来源:转载
供稿:网友

前言

在16年的时候因为项目接触到websocket,而后对心跳重连做了一次总结,写了篇博客,而后18年对之前github上的demo代码进行了再次开发和开源,最终封装成库。如下:

github: https://github.com/zimv/websocket-heartbeat-js
npm: https://www.npmjs.com/package/websocket-heartbeat-js

在2020年也就是今年初,同事建议说可以考虑兼容一下小程序,心想也挺好的。便有了今天的 websocket-heartbeat-miniprogram,这次基于以前的代码新建了一个项目,只做小程序的版本,因为涉及到各种小程序以及相关框架的兼容,觉得还是单独出一个包,更专注一点。

介绍

websocket-heartbeat-miniprogram基于小程序的websocket相关API进行封装,主要目的是保障客户端websocket与服务端连接状态。该程序有心跳检测及自动重连机制,当网络断开或者后端服务问题造成客户端websocket断开,程序会自动尝试重新连接直到再次连接成功。兼容市面上大部分小程序微信,百度,支付宝等,只要都是统一的小程序weboscket-API规范。也支持小程序框架比如Taro等。无论如何,业务是需要一层心跳机制的,否则一些情况下会丢失连接导致功能无法使用。

用法

安装

npm install --save websocket-heartbeat-miniprogram

引入使用

import WebsocketHeartbeat from 'websocket-heartbeat-miniprogram';WebsocketHeartbeat({  miniprogram: wx,  connectSocketParams: {    url: 'ws://xxx'  }})  .then(task => {    task.onOpen = () => {//钩子函数      console.log('open');    };    task.onClose = () => {//钩子函数      console.log('close');    };    task.onError = e => {//钩子函数      console.log('onError:', e);    };    task.onMessage = data => {//钩子函数      console.log('onMessage', data);    };    task.onReconnect = () => {//钩子函数      console.log('reconnect...');    };    task.socketTask.onOpen(data => {//原生实例注册函数,重连后丢失      console.log('socketTask open');    });    task.socketTask.onMessage(data => {//原生实例注册函数,重连后丢失      console.log('socketTask data');    });  })

本程序内部总是使用小程序connectSocket方法进行socket连接,如果socket断开,本程序内部会再次执行小程序的connectSocket方法,以此来重新建立连接,重连都会建立新的小程序socket实例。

WebsocketHeartbeat方法返回一个promise,返回的task对象是本程序的一个实例,提供了onOpen,onClose,onError,onMessage,onReconnect等钩子函数。也暴露了小程序本身的实例(socketTask),task.socketTask就是小程序connectSocket返回的实例,而task.socketTask是小程序的原生实例,它们通过onXXX方法传递函数进行监听注册,在socket重连以后,内部重新通过connectSocket新建实例,将会返回新的小程序原生实例,因此之前通过socketTask.onXXX注册的这些函数将会丢失。而本程序内部提供的钩子函数重连上以后依然有效。大部分情况下推荐就使用本程序的钩子函数。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选