Score
0
Watch 7 Star 42 Fork 6

OkCoder / uni-socket-promiseJavaScriptMIT

Join us
Explore and code with more than 2 million developers,Free private repositories !:)
Sign up
uni-app框架 websocket和promise封装 spread retract

Clone or download
Cancel
Notice: Creating folder will generate an empty file .keep, because not support in Git
Loading...
README.md

uni-socket-promise

安装

npm i @i5920/uni-socket-promise -S

使用

  1. 前端
import UniSocketPromise from "@i5920/uni-socket-promise"
export default {
  onLaunch() {
    this.globalData.socket = new UniSocketPromise({
        url: "ws://127.0.0.1:8080",
        heartTime: 1 * 60 * 1000, // 心跳时间间隔
        isHeartData: true,        // 是否发送心跳
        isReconnect:true,         // 是否断线重连
        reConnectTime: 3000,      // 断线重连检测时间间隔
        debug: process.env.NODE_ENV === "development",  // debug
        onSocketOpen: header => {},
        onSocketError:res => {},
        onSocketClose:res => {},
        onSocketMessageAfter: (data, pool) => {
          if (data.error === 0) {
            pool.resolve(data);
          } else {
            pool.reject(data);
          }
        }
    });
  },
  // 必须在这里调用initSocket方法
  onShow() {
    // 连接socket
    this.globalData.socket.initSocket();
    // 登录
    this.loginDemo();
  },
  methods:{
    // 发送socket消息
    loginDemo(){
      this.globalData.socket.send("login",{
          "username":"okcoder",
          "password":"666666"
      },{
        'token':"12345"
      }).then(_=>{
          console.warn(_)
      });
    },
    // 主动关闭socket
    closeSocket(){
      this.globalData.socket.close();
    }
  }
}
// 其它页面
getApp().globalData.socket.send("事件名称",{
    "username":"okcoder",
    "password":"666666"
}).then(_=>{
    console.warn(_)
});
  1. 后端格式要求
{
    event:"标识",   // 要求根据前端发送的数据进行组合加密 -> md5(事件名称字符串+参数字符串)
    data:{         // 自定义数据
      error:0,
      data:[]
    }
}


// 以PHP为列子 JSON_UNESCAPED_SLASHES + JSON_UNESCAPED_UNICODE  必须加上,比如PHP可能会对url加反斜杠,中文编码
// event的值为 
md5('前端发来的事件名称' . (string)json_encode('前端发来的参数', JSON_UNESCAPED_SLASHES + JSON_UNESCAPED_UNICODE));
// data的值 自定义 比如 
{
    event:"****",
    data:{
        'error':0,
        'data':[]
    }
}

方法说明

  • initSocket(success, fail)

    • 初始化websocket
    • 判断websocket是否连接
    • 参数
      1. success 连接成功,如果是第一次则open可能还没有打开
      2. fail 连接失败
  • send(event,data,extraData)

    • 发送socket消息
    • 参数
      1. event:string 事件名称
      2. data?:object 请求参数,必须json对象或者空对象{}或者不传值
      3. extraData?:object 同级参数
  • close({code,reason,success,fail,complete})

    • 主动关闭socket
    • 参数(对象)
      1. code?: number
      2. reason?: string
      3. success?: Function
      4. fail?: Function
      5. complete?: Function
  • 如果发送其它格式的消息直接使用uni.sendSocketMessage()

参数说明

  1. config参数
参数 类型 必填 默认值 说明
url string - websocket地址,如ws://127.0.0.1:8080
debug boolean 开发环境自动打开 调试开关
header object - 参考https://uniapp.dcloud.io/api/request/websocket?id=connectsocket
method string - 参考https://uniapp.dcloud.io/api/request/websocket?id=connectsocket
protocols string[] - 参考https://uniapp.dcloud.io/api/request/websocket?id=connectsocket
isReconnect boolean true 是否断线重连
reConnectTime number 3000 断线重连间隔时间,毫秒
isHeartData boolean true 是否发送心跳
heartTime number 3000 心跳包间隔事件,毫秒
  1. config回调方法
回调方法 参数 说明
onSocketOpen callback(header) 监听到socket打开事件
onSocketClose callback(res) 监听到socket被关闭事件
onSocketError callback(res) 监听到socket出错事件
onSendMessageBefore callback(message) 发送消息前事件,必须返回{event:"",data:''},因为要继续下面的逻辑
onSendMessageAfter callback(message) 发送消息后事件
onSocketMessageBefore callback(data) 收到消息前事件,如果返回true则继续逻辑,返回false则终止逻辑,千万注意如果要继续逻辑必须返回true
onSocketMessageAfter callback(data,pool) data为接收到的数据,pool为当前线程池,含promise方法

赞助二维码

更新日志

  • v2.0.16

    1. [优化]onSocketMessageAfter方法回调优化
  • v2.0.14

    1. [修复]在app端第一次接收到数据后无法再次接收的问题
  • v2.0.13

    1. [新增]网络检测 注意:由于官方bug,iOS网络检测有问题
    2. [优化]逻辑优化
  • v2.0.12

    1. [优化]send方法 data参数必须是json对象或者空对象{}或者不传值,默认发送空字符,方便后端解析与md5加密统一
  • v2.0.9

    1. [bug]utility插件不给力,改为md5-ts
  • v2.0.8

    1. [bug]Pool使用完后立马删除
  • v2.0.7

    1. [bug]send方法添加同级请求参数
  • v2.0.6

    1. [优化]send方法添加同级请求参数
  • v2.0.5

    1. [优化]onSocketMessageBefore如果返回true可继续逻辑,返回false则终止逻辑

Comments ( 3 )

Sign in for post a comment

JavaScript
1
https://gitee.com/okcoder/uni-socket-promise.git
git@gitee.com:okcoder/uni-socket-promise.git
okcoder
uni-socket-promise
uni-socket-promise
master

Help Search