上家公司离职,总结一下在上家公司工作时造的一下轮子,顺便在这边分享一下
由于上家公司做的是跟小程序的产品的有关,用到了webScoket,今天就在这边分享一下当时造的轮子,新人第一次发帖,刚入门的小白一枚,不喜请口下留情啊。。。
基于微信小程序的scoket 上进行的二次封装
- 加入观察者模式,可以跨页面接收任何scoket数据
- 支持后端数据拦截,dataValidation方法可以拦截任何后端返回数据,进行数据发送成功或者失败判断
- scoket支持自动重连,并且可以设置重连次数 重连间隔时间
- scoket支持实例化时立即创建并连接,也可以手动创建并连接
- 前后端约定指令支持参数化配置
- 支持scoket创建成功/失败回调 scoket 打开成功/失败回调
- 目前只是自己随便测过,使用前最好自己先测试一下,如有问题可以联系vx:b948993029
| config字段名 | 类型 | 描述 |
|---|---|---|
| Debug | Boolean | 是否开启调试,开启后会打印每个阶段的调试信息,也可以自己增加打印信息 |
| environment | Boolean | true 正式 false 测试服务器 |
| HttpSocketUrl | String | 正式环境scoketuUrl地址 |
| HttpTestSocketUrl | String | 测试环境scoketuUrl地址 |
| scoketHeader | Object | scoket Header 头部信息 例如:{'content-type': 'application/json'} |
| heartBeatWait | Number | 心跳间隔 单位/毫秒 |
| autoReconnectNumMax | Number | 自动重连次数 0代表一直尝试重连 |
| reconnectionInterval | Number | 自动重连间隔 单位/毫秒 |
| Iscreate | Boolean | 值:true 对象实例化时立即创建并连接 值:false 对象实例化时不立即创建并连接,可以调用 createScoket()方法进行创建并连接 |
| instructionCheck | Function(data) | 返回值跟监听时输入的key要匹配上,否则会监听不到,解析到后端返回的指令后,把值 return 回去 |
| heartbeatConnection | Function(无返回值)/Object | 心跳连接例如1:Function(){ wx.$scoket.sendMsg({action:4,chatMsg:null})}例如2:Object {action:4,chatMsg:null} |
| dataValidation | 接收数据校验 用于判断后端返回的数据是成功还是失败 成功 return true 失败 return false | |
| success | Function(data) | scoket 链接创建成功/打开成功回调 |
| fail | Function(data) | scoket 链接创建失败/打开失败回调 |
使用示例
const scoket = require('./xxx/webScoket.js');
const config = {
Debug: false, //是否开启调试
environment: true, //true 正式 false 测试服务器
HttpSocketUrl: 'xxxxxxxxxxx', //正式环境
HttpTestSocketUrl: 'xxxxxxxx', //测试环境
scoketHeader: { // scoket Header
'content-type': 'application/json'
},
heartBeatWait: 2000, //心跳间隔 ms
autoReconnectNumMax: 2, //自动重连次数 0代表无数次
reconnectionInterval: 10000, // 重连间隔 ms
Iscreate: true, // 是否立即连接
instructionCheck:(data)=>{},// 后端返回指令校验
heartbeatConnection:(data)=>{}, // 心跳连接
dataValidation:(data)=>{},// 接收数据校验 用于判断后端返回的数据是成功还是失败 成功 return true 失败 return false
success: (res) => {},// scoket 创建成功/打开成功回调
fail: (err) => {},// scoket 创建失败/打开失败回调
}
scoket实例方法
| 方法 | 参数 | 描述 |
|---|---|---|
| on | on(string,success,fail) | 用于监听后端返回消息 wx.$scoket.on('前后端约定指令',success 数据接收成功,fail:数据接收失败) |
| once | on(string,success,fail) | 只监听一次后端返回消息 wx.$scoket.once('前后端约定指令',success 数据接收成功,fail:数据接收失败) |
| off | on(string) | 取消监听 wx.$scoket.off('前后端约定指令') |
| sendMsg | sendMsg(object,success,fail) | 发送消息sendMsg(’要发送给后端的数据对象',success 数据接收成功,fail:数据接收失败) |
| closeScoket | closeScoket() | 关闭scoket |
wx.$scoket = new scoket(config);// 初始化对象实例
// 监听 bind 指令
wx.$scoket.on('bind' // 前后端约定指令 ,(res)=>{
console.log('接收成功',res)
},(err)=>{
console.log('数据错误',err)
})
// 监听一次 sayworld 指令
wx.$scoket.once('sayworld',(res)=>{
console.log('接收成功',res)
},(err)=>{
console.log('数据错误',err)
})
wx.$scoket.off('sayworld'// 前后端约定指令,);
// 发送 scoket 消息
wx.$scoket.sendMsg({
action:4, // 指令
chatMsg:null,// 消息体
},(res)=>{
console.log('发送成功',res)
},(err)=>{
console.log('发送失败',err)
})
// 关闭scoket 链接
wx.$scoket.closeScoket()