// 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函数中加入

   chat.onSocketMessageCallback = this.onSocketMessageCallback;//onSocketMessageCallback是回调函数名
   以上就是一个完整的wobsocket实例

小程序websocket用法的更多相关文章

  1. 微信小程序websocket

    微信小程序websocket 微信小程序带有websocket可以提供使用,但是官方文档写的东西很少,而且小程序后台能力弱这一点也是十分的坑爹,这就导致了socket长连接一切后台就会出现断开的情况, ...

  2. 微信小程序 WebSocket 使用非 443 端口连接

    前言 微信小程序支持使用 WebSocket 连接到服务器,准确地说是带 SSL 的 WebSocket,而微信小程序中不允许使用带端口的 wss 连接,只能使用 443 端口.想使用其他端口就需要在 ...

  3. 关于小程序websocket全套解决方案,Nginx代理wss

    需求对话 提问 我在本地web能够使用ws协议去链接websocket,但是小程序不能使用. 回答 由于小程序使用的是SSL加密协议,所以需要使用wss.这里wss与ws的关系就相当于https于ht ...

  4. 小程序websocket心跳库——websocket-heartbeat-miniprogram

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

  5. 微信小程序-WebSocket

    wx.connectSocket(OBJECT) 创建一个 WebSocket 连接:一个微信小程序同时只能有一个 WebSocket 连接,如果当前已存在一个 WebSocket 连接,会自动关闭该 ...

  6. 微信小程序-WebSocket应用

    为何有 HTTP 协议还需要 WebSocket ? Http协议 有个缺陷:通信只能由客户端发起.举例来说,我们想了解今天的天气,只能是客户端向服务器发出请求,服务器返回查询结果.HTTP 协议做不 ...

  7. 快速上手微信小程序webSocket

    WebSocket是一种在单个TCP连接上进行全双工通信的协议.WebSocket通信协议于2011年被IETF定为标准RFC 6455,并由RFC7936补充规范.WebSocket API也被W3 ...

  8. uniapp小程序webSocket封装使用

    目录 1,前言 2,代码实现 3,使用 3.1,初始化 3.2,发送消息 3.3,接收消息 1,前言 最近在做IOT的项目,里面有个小程序要用到webSocket,借这个机会,封装了一个uniapp小 ...

  9. es6Promise及小程序Promise用法

    本文主要说一下Promise,Prepending(进行时),Resolve(成功了),Reject(失败了),then在小程序中的实际应用 关于promise的介绍什么的就不说了网上一搜一大堆,这里 ...

随机推荐

  1. 08-SV面向对象编程的高级技巧指南

    1.原始类与扩展类 (1)原始类被称为父类或者超类,扩展类被称为派生类或者子类.扩展类可以直接访问原始类和其本身的所有变量,应该将原始类中的子程序定义成虚拟的,这样它们就可以在扩展类中重定义.new函 ...

  2. win10专业工作站版密钥|win10专业工作站版key|win10专业工作站版激活码

    一.windows10专业工作站零售版密钥 永久激活 Win 10 ProfessionalWorkstation Retail [Key]:DXG7C-N36C4-C4HTG-X4T3X-2YV77 ...

  3. script标签引入脚本的引入位置与效果

    用script标签引入脚本的引入位置大致有两种情况: 1,在head中引入: 2,在body末尾引入: 浏览器由上到下解析代码,正常情况下,先解析head中的代码,在解析body中的代码:放在head ...

  4. mac 安装Kafka

    1. 安装zookeeper brew install zookeeper 默认安装位置 启动文件: /usr/local/Cellar/zookeeper/3.4.10/bin/ 配置文件: /us ...

  5. react-native简单使用

    基本组件的使用介绍 View: Text: TextInput: Image: Button: ActivityIndicator: ScrollView:这是一个列表滚动的组件 ListView:也 ...

  6. 链表问题----删除倒数第K个节点

    在单链表和双链表中删除倒数第K个节点 分别实现两个函数,一个可以删除单链表中的倒数第K个节点,一个可以删除双链表中的倒数第k 个节点,要求时间复杂度是 O(N),空间复杂度是 O(1). [解析] 基 ...

  7. 《深入理解java虚拟机》读书笔记二——第三章

    第三章 垃圾收集器与内存分配策略 1.判断对象是否已死 引用计数法: 给对象添加一个引用计数器,每当有一个地方引用它时,计数器值就加1,每当引用失效时,计数器值就减1. 任何时刻计数器为0的对象就是不 ...

  8. 1.mysql卸载重新安装问题

    前言:在开发过程中,MySQL数据库是很频繁使用的数据库,但是有时候,数据库一单出错,或者其他原因,想要重装数据库,难免会遇到MySQL重装之后服务启不来,,下面我就跟大家讨论下如何干净的卸载MySQ ...

  9. 5.Dockerfile 定制镜像

    概述 Dockerfile 是一个文本文件,其内包含了一条条的 指令(Instruction),每一条指令构建一层,因此每一条指令的内容,就是描述该层应当如何构建. 以之前的 Nginx 镜像为例,这 ...

  10. markdown文本编辑学习笔记2

    目录 1.删除线 2.无序列表 4 todo list 5分割符号 6 TOC自动生成目录 7 插入代码块 8 斜体.粗体.删除线.下划线.背景高亮 markdown编辑公式 1.删除线 ~~要删除的 ...