小程序websocket用法
// socket已经连接成功
var socketOpen = false
// socket已经调用关闭function
var socketClose = false
// socket发送的消息队列
var socketMsgQueue = []
// 判断心跳变量
var heart = ''
// 心跳失败次数
var heartBeatFailCount = 0
// 终止心跳
var heartBeatTimeOut = null;
// 终止重新连接
var connectSocketTimeOut = null;
var i=1
const url = ''//socket链接地址,需要在微信后台配置
var webSocket = {
connectSocket: function () {
// wx.showLoading({
// title: '',
// mask: true,
// })
socketOpen = false
socketClose = false
socketMsgQueue = []
wx.connectSocket({
url: 'ws://' +url+'/websocket/'+wx.getStorageSync('token'),
// header: { 'ticket': wx.getStorageSync('token')},
success: function (res) {
if (res) {
// 成功回调
// console.log(res)
// options.success && options.success(res);
}
},
fail: function (res) {
if (res) {
// 失败回调
// options.fail && options.fail(res);
}
}
})
}, /**
* 通过 WebSocket 连接发送数据
* @param {options}
* data String / ArrayBuffer 是 需要发送的内容
* success Function 否 接口调用成功的回调函数
* fail Function 否 接口调用失败的回调函数
* complete Function 否 接口调用结束的回调函数(调用成功、失败都会执行)
*/
sendSocketMessage: function (options) {
if (socketOpen) {
wx.sendSocketMessage({
data: options.msg,
success: function (res) {
if (options) {
options.success && options.success(res);
}
},
fail: function (res) {
if (options) {
options.fail && options.fail(res);
}
}
})
} else {
socketMsgQueue.push(options.msg)
}
}, /**
* 关闭 WebSocket 连接。
* @param {options}
* code Number 否 一个数字值表示关闭连接的状态号,表示连接被关闭的原因。如果这个参数没有被指定,默认的取值是1000 (表示正常连接关闭)
* reason String 否 一个可读的字符串,表示连接被关闭的原因。这个字符串必须是不长于123字节的UTF-8 文本(不是字符)
* fail Function 否 接口调用失败的回调函数
* complete Function 否 接口调用结束的回调函数(调用成功、失败都会执行)
*/
closeSocket: function (options) {
if (connectSocketTimeOut) {
clearTimeout(connectSocketTimeOut);
connectSocketTimeOut = null;
}
socketClose = true;
var self = this;
self.stopHeartBeat();
wx.closeSocket({
success: function (res) {
console.log('WebSocket 已关闭!');
if (options) {
options.success && options.success(res);
}
},
fail: function (res) {
if (options) {
options.fail && options.fail(res);
}
}
})
}, // 收到消息回调
onSocketMessageCallback: function (msg) { }, // 开始心跳
startHeartBeat: function () {
console.log('socket开始心跳')
var self = this;
heart = 'heart';
self.heartBeat();
}, // 结束心跳
stopHeartBeat: function () {
console.log('socket结束心跳')
var self = this;
heart = '';
if (heartBeatTimeOut) {
clearTimeout(heartBeatTimeOut);
heartBeatTimeOut = null;
}
if (connectSocketTimeOut) {
clearTimeout(connectSocketTimeOut);
connectSocketTimeOut = null;
}
}, // 心跳
heartBeat: function () {
var self = this;
if (!heart) {
return;
}
self.sendSocketMessage({
msg: JSON.stringify({
'messageType':1//心跳
}),
success: function (res) {
console.log('socket心跳成功');
if (heart) {
heartBeatTimeOut = setTimeout(() => {
self.heartBeat();
}, 60000);
}
},
fail: function (res) {
console.log('socket心跳失败');
if (heartBeatFailCount > 2) {
// 重连
self.connectSocket();
}
if (heart) {
heartBeatTimeOut = setTimeout(() => {
self.heartBeat();
}, 60000);
}
heartBeatFailCount++;
},
});
}
} // 监听WebSocket连接打开事件。callback 回调函数
wx.onSocketOpen(function (res) {
console.log('WebSocket连接已打开!')
wx.hideLoading();
// 如果已经调用过关闭function
if (socketClose) {
webSocket.closeSocket();
} else {
socketOpen = true
for (var i = 0; i < socketMsgQueue.length; i++) {
webSocket.sendSocketMessage(socketMsgQueue[i])
}
socketMsgQueue = []
webSocket.startHeartBeat();
}
}) // 监听WebSocket错误。
wx.onSocketError(function (res) {
console.log('WebSocket连接打开失败,请检查!', res)
}) // 监听WebSocket接受到服务器的消息事件。
wx.onSocketMessage(function (res) {
console.log('收到服务器内容:' + res.data)
if (res.data =='SUCCESS'){
return;
}
webSocket.onSocketMessageCallback(res.data)
}) // 监听WebSocket关闭。
wx.onSocketClose(function (res) {
console.log('WebSocket 已关闭!')
//if (!socketClose) {
let time = Math.pow(2, i)
i++
if (time==8){
i=1
}
clearTimeout(connectSocketTimeOut)
connectSocketTimeOut = setTimeout(() => {
webSocket.connectSocket();
}, time*1000);
//}
}) module.exports = webSocket;
在需要的页面引入,然后在onload函数中加入
小程序websocket用法的更多相关文章
- 微信小程序websocket
微信小程序websocket 微信小程序带有websocket可以提供使用,但是官方文档写的东西很少,而且小程序后台能力弱这一点也是十分的坑爹,这就导致了socket长连接一切后台就会出现断开的情况, ...
- 微信小程序 WebSocket 使用非 443 端口连接
前言 微信小程序支持使用 WebSocket 连接到服务器,准确地说是带 SSL 的 WebSocket,而微信小程序中不允许使用带端口的 wss 连接,只能使用 443 端口.想使用其他端口就需要在 ...
- 关于小程序websocket全套解决方案,Nginx代理wss
需求对话 提问 我在本地web能够使用ws协议去链接websocket,但是小程序不能使用. 回答 由于小程序使用的是SSL加密协议,所以需要使用wss.这里wss与ws的关系就相当于https于ht ...
- 小程序websocket心跳库——websocket-heartbeat-miniprogram
前言 在16年的时候因为项目接触到websocket,而后对心跳重连做了一次总结,写了篇博客,而后18年对之前github上的demo代码进行了再次开发和开源,最终封装成库.如下: 博客:https: ...
- 微信小程序-WebSocket
wx.connectSocket(OBJECT) 创建一个 WebSocket 连接:一个微信小程序同时只能有一个 WebSocket 连接,如果当前已存在一个 WebSocket 连接,会自动关闭该 ...
- 微信小程序-WebSocket应用
为何有 HTTP 协议还需要 WebSocket ? Http协议 有个缺陷:通信只能由客户端发起.举例来说,我们想了解今天的天气,只能是客户端向服务器发出请求,服务器返回查询结果.HTTP 协议做不 ...
- 快速上手微信小程序webSocket
WebSocket是一种在单个TCP连接上进行全双工通信的协议.WebSocket通信协议于2011年被IETF定为标准RFC 6455,并由RFC7936补充规范.WebSocket API也被W3 ...
- uniapp小程序webSocket封装使用
目录 1,前言 2,代码实现 3,使用 3.1,初始化 3.2,发送消息 3.3,接收消息 1,前言 最近在做IOT的项目,里面有个小程序要用到webSocket,借这个机会,封装了一个uniapp小 ...
- es6Promise及小程序Promise用法
本文主要说一下Promise,Prepending(进行时),Resolve(成功了),Reject(失败了),then在小程序中的实际应用 关于promise的介绍什么的就不说了网上一搜一大堆,这里 ...
随机推荐
- 1级搭建类108-Oracle 11gR2 SI FS(Windows Server 2019)公开
Oracle 11gR2 单实例文件系统在Windows Server 2019上的安装 在线查看
- 内置中间件CommonMiddleware
django.middleware.common.CommonMiddleware:通用的中间件 (1)如果网站在设计的时候,url带有"/",而用户在访问的时候没有加上" ...
- JavaScript 15 Ajax异步登陆
/** * Created by KING on 2017/11/28. */ var g_xhr_ui;var g_xhr_login;var g_id; $(document).ready(fun ...
- react-native构建基本页面2---轮播图+九宫格
配置首页的轮播图 轮播图官网 运行npm i react-native-swiper --save安装轮播图组件 导入轮播图组件import Swiper from 'react-native-swi ...
- PHP常见数组函数总结
一.数组的一些关于键名和值的基础操作函数 1.获取数组所有的键或值:array_keys() array_values() $arr_keys = array_keys($array); $arr_v ...
- 【Unity|C#】基础篇(2)——栈与堆、值类型与引用类型
传送门:https://www.cnblogs.com/moonache/p/6008048.html [笔记] 图1:值类型与引用类型 存储方式 > 值类型:数据直接存在栈中 > 引用类 ...
- Windows修改账户名称和任务管理器中服务对应的用户名称
新安装的Windows10,在激活的时候如果选择使用微软账户登录,比如我的微软账户名是QQ邮箱,系统激活后,系统盘用户目录(users)下面的用户目录文件夹名称为QQ邮箱的前几位数字,这样其实也在使用 ...
- 假期学习【九】首都之窗百姓信件爬取代码优化以及处理 2020.2.7 Python
今天对爬取程序进行了优化,修正了错误. 遇到了两个问题与错误: 1.忘记了对文件的读写设置格式,导致导入Hive数据库无法正常显示以及写入. 2.文件的读写操作有误导致数据量仅有应该有的1/2 不完整 ...
- vjudge A^B Mod C 然后,10.6最。。。的 快速幂!!!
链接:https://vjudge.net/contest/331993#problem/D 给出3个正整数A B C,求A^B Mod C. 例如,3 5 8,3^5 Mod 8 = 3. Inpu ...
- F 采蘑菇的克拉莉丝
这是一道树链剖分的题目: 很容易想到,我们在树剖后,对于操作1,直接单点修改: 对于答案查询,我们直接的时候,我们假设查询的点是3,那么我们在查询的时候可分为两部分: 第一部分:查找出除3这颗子树以外 ...