天津做网站企业,南阳建设局网站,网站诊断网站seo诊断,北京最新新闻适合场景#xff1a;只需要发送一次数据#xff0c;服务器可以实时返回数据进行渲染。 socket文件
let isSocketClose false; // 是否关闭socket
let reconnectCount 5; // 重连次数
// let heartbeatInterval ; // 心跳定时器
let socketTask null; // web…适合场景只需要发送一次数据服务器可以实时返回数据进行渲染。 socket文件
let isSocketClose false; // 是否关闭socket
let reconnectCount 5; // 重连次数
// let heartbeatInterval ; // 心跳定时器
let socketTask null; // websocket对象let againTimer null; //断线重连定时器let url null;
let onReFn null;
let onSucFn null;
let onErrFn null;/*** sockeUrlwebsocet的地址* onReceive消息监听的回调* onErrorEvent抛出错误的回调且弹窗连接失败的提示框* onErrorSucceed抛出成功回调主要用于隐藏连接失败的提示框* */
const sokcet (sockeUrl, onReceive, onErrorEvent, onErrorSucceed) {url sockeUrl;onReFn onReceive;onErrFn onErrorEvent;onSucFn onErrorSucceed;isSocketClose false;//判断是否有websocet对象有的话清空if (socketTask) {console.log(清空ws);socketTask.close();socketTask null;// clearInterval(heartbeatInterval);}//WebSocket的地址// 【非常重要】必须确保你的服务器是成功的,如果是手机测试千万别使用ws://127.0.0.1:9099【特别容易犯的错误】let url sockeUrl// 连接socketTask uni.connectSocket({url: url,success(data) {console.log(清空ws重连定时器);clearInterval(againTimer) //断线重连定时器console.log(连接成功);},fail: (err) {console.log(url)console.log(报错, err);}});// 连接打开socketTask.onOpen((res) {console.log(WebSocket打开);uni.showToast({title: loading...,icon: none,})clearInterval(againTimer) //断线重连定时器onErrorSucceed({isShow: false}) // 用于提示框的隐藏// heartbeatInterval clearInterval(heartbeatInterval);// 10秒发送一次心跳// heartbeatInterval setInterval(() {// sendMsg(心跳ing)// }, 1000 * 5)})// 监听连接失败socketTask.onError((err) {console.log(WebSocket连接打开失败请检查, err);//停止发送心跳// clearInterval(heartbeatInterval)//如果不是人为关闭的话进行重连if (!isSocketClose) {reconnect(url, onErrorEvent)}})// // 监听连接关闭 -socketTask.onClose((e) {console.log(WebSocket连接关闭);// clearInterval(heartbeatInterval)console.log(isSocketClose, 123);if (!isSocketClose) {reconnect(url, onErrorEvent)}})// 监听收到信息socketTask.onMessage((res) {uni.hideLoading()// console.log(res, res监听收到信息)let serverData res.data//与后端规定好返回值分别代表什么写业务逻辑serverData onReceive(serverData);});
}const reconnect (url, onErrorEvent) {console.log(进入断线重连1, isSocketClose);clearInterval(againTimer) //断线重连定时器// clearInterval(heartbeatInterval);socketTask socketTask.close(); // 确保已经关闭后再重新打开console.log(进入断线重连2, isSocketClose);socketTask null;onErrorEvent({isShow: true,messge: 扫描头服务正在连接...})uni.showToast({title: loading...,icon: none,})// 连接 重新调用创建websocet方法againTimer setInterval(() {sokcet(url, onReFn, onErrFn, onSucFn)console.log(在重新连接中...);}, 1000)}const sendMsg (msg) { //向后端发送命令msg JSON.stringify(msg)try {//通过 WebSocket 连接发送数据socketTask.send({data: msg});} catch (e) {console.log(e, sendMsg Error);if (isSocketClose) {return} else {reconnect(url, onErrFn)}}
}
// 关闭websocket【必须在实例销毁之前关闭,否则会是underfined错误】beforeDestroy() {websocetObj.stop();}const stop () {console.log(关闭定时器1);isSocketClose true// clearInterval(heartbeatInterval);clearInterval(againTimer) //断线重连定时器socketTask.close(); // 确保已经关闭后再重新打开socketTask null;console.log(关闭定时器2, socketTask);
}const $debounce function(fn, wait) {let timer null;return function() {if (timer ! null) {clearTimeout(timer);}timer setTimeout(fn, wait);}
}export const websocetObj {sokcet,stop,sendMsg
};页面中使用 scriptimport {websocetObj} from /common/websocket.js;export default {methods:{//websocet函数回调返回监听的数据getWebsocetData(val) {this.bids JSON.parse(val).data.tick.bidsthis.asks JSON.parse(val).data.tick.asks},//websocet函数抛错 返回错误信息 用于用户提示getWebsocetError(err) {this.socketShow err.isShow;this.webtext err.messge;console.log(websocet函数抛错, this.socketShow);},//websocet函数成功进入 监听连接状态在失败的时候弹窗提示具体需求看自身情况onErrorSucceed(val) {this.socketShow val.isShow;websocetObj.sendMsg({api: market_depth,symbol: this.currencyShortParam})},websocket() {websocetObj.sokcet(ws://18.166.64.181:2346, this.getWebsocetData, this.getWebsocetError, this.onErrorSucceed) //请求地址},stopSocket() {websocetObj.stop()}},onShow() {this.websocket()},onHide() {this.stopSocket()},}/script
