uniapp的长链接的使用

Posted 2023-03-16

参考技术A connectSocketInit()

    // 创建一个this.socketTask对象(发送、接收、关闭socket都由这个对象操作)

    uni.connectSocket(

        url:'地址',

        success(data)

            // console.log("websocket连接成功",data)

        

    )

    //监听socket打开

    uni.onSocketOpen(()=>

        this.is_open_socket=true

        // console.log('WebSocket连接已打开！')

        this.connectSocketInit()

    )

    //监听socket关闭

    uni.onSocketClose(()=>

        this.is_open_socket=false;

        this.connectSocketInit()

        // console.log('WebSocket连接已关闭！')

    )

    //监听socket错误

    uni.onSocketError(()=>

        this.is_open_socket=false

        this.connectSocketInit()

        // console.log('WebSocket连接打开失败');

    )

    uni.onSocketMessage((res)=>

        console.log(res)

    )

    //先确保清除了之前的心跳定时器

    clearInterval(this.pingpangTimes)

        // 每过一段时间发送一次心跳，发送Ping,服务器会反馈pong，这样操作以保持socket一直是连接状态，防止断开连接，心跳停止

        this.pingpangTimes=setInterval(()=>

            // 心跳传参

            let heartData =

                type:'ping',

            

        uni.sendSocketMessage(

            data: JSON.stringify(heartData),

            success:(res)=>

                // console.log('心跳的返回：',res) 其实监听里面有，或者不返回跟后端，用处不大，可以删除

            ,

            fail:(res)=>

                // console.log(res)

                this.is_open_socket=false

            

        );

    ,30000);



1.报错断开的重连，可以写个定时隔一段时间连接也行

2.uni.onSocketMessage() 主要是这个里面处理数据，这里会实时监听最新的数据

3.这个长链接在全局引用一次就行了，所以推荐放在一开始进入时的引用，放在app.vue也不错。全局就可以使用uni.onSocketMessage()监听数据，对一些需要实时更新的页面进行监听。再配合uni.sendSocketMessage( data: JSON.stringify(jsonData));发送数据使用，也是全局都可以发送了(个人理解，如有错误，请大佬告知我，即使修改)

例如