uniapp的websoket的api使用方法

websoket() {
                console.log('初始化');
                uni.connectSocket({
                    url: 'ws://192.168.1.111:19107/hand',
                })
                uni.onSocketOpen(function(res) {
                    uni.$u.toast('WebSocket连接已打开!')
                });
                uni.onSocketError(function(res) {
                    uni.$u.toast('WebSocket连接打开失败,请检查!')
                });
            },
            jiexiaoxi() {
                console.log('收到的消息');
                    uni.onSocketMessage(function(res) {
                    console.log('收到服务器内容:' + res.data);
                })
            },
            async fasong() {
                const params={
                    receiveUserid:'e68b0d11d077a4929f0333dd87f67c7e',
                    message:'测试'
                }
                const arr=await http.post('/api/chat/chatAdd',params)
                console.log(arr);
            },
            shoucilianjie() {
                setTimeout(()=>{
                    const data = {
                    "action": "init",
                    "chatMsg": {
                        "senderId": 'e68b0d11d077a4929f0333dd87f67c7e',
                        "receiverId": "",
                        "msg": ""
                    }
                }
                const msg = JSON.stringify(data)
                console.log('登录发送');
                uni.sendSocketMessage({
                    data: msg,
                    success:(res)=>{console.log(res)}
                });
                },100)
                
            },
            xintiao() {
                setInterval(()=>{
                    const data = {
                        action: 'heartbeat'
                    }
                    const msg = JSON.stringify(data)
                    console.log('心跳');
                    uni.sendSocketMessage({
                        data: msg,
                        success:(res)=>{console.log(res)}
                    });
                },10000)
                    
            },

执行顺序

 this.websoket()先建立链接
 this.shoucilianjie()建立后验证身份
 this.xintiao()身份验证完毕后建立心跳

 this.jiexiaoxi()最后接收消息

### 如何在 UniApp使用 WebSocket 进行通信 #### 一、WebSocket 的基本概念 WebSocket 是一种全双工通信协议,允许客户端和服务端之间保持持久连接并实现实时数据交换。相比传统的 RESTful 接口,它更适合需要频繁交互的应用场景,比如聊天应用或实时监控系统。 #### 二、UniApp 中 WebSocket 的实现方式 在 UniApp 中,可以通过 `wx.connectSocket` 和其他相关 API 来完成 WebSocket 的初始化和消息传递功能[^3]。以下是完整的实现流程: --- #### 三、代码示例 ##### 1. 初始化 WebSocket 链接 通过调用 `uni.connectSocket` 方法建立与服务端的 WebSocket 连接。 ```javascript // 建立 WebSocket 连接 const socketTask = uni.connectSocket({ url: 'wss://example.com/socket', // 替换为实际的服务端地址 success(res) { console.log('WebSocket 成功连接:', res); }, fail(err) { console.error('WebSocket 连接失败:', err); } }); ``` ##### 2. 发送消息给服务器 当成功建立连接后,可以向服务端发送消息。 ```javascript socketTask.onOpen(() => { console.log('WebSocket 已打开'); // 向服务端发送一条测试消息 socketTask.send({ data: JSON.stringify({ message: 'Hello, Server!' }), success() { console.log('消息已发送'); }, fail(err) { console.error('消息发送失败:', err); } }); }); ``` ##### 3. 接收来自服务器的消息 监听 `onMessage` 事件来接收服务端返回的数据。 ```javascript socketTask.onMessage((res) => { const receivedData = JSON.parse(res.data); // 解析收到的数据 console.log('从服务器接收到消息:', receivedData); // 可在此处处理逻辑,例如更新 UI 或存储数据 }); ``` ##### 4. 关闭 WebSocket 连接 如果不再需要维持连接,则应主动关闭 WebSocket。 ```javascript socketTask.close({ success() { console.log('WebSocket 已关闭'); }, fail(err) { console.error('关闭 WebSocket 失败:', err); } }); ``` --- #### 四、注意事项 - **超时设置**:为了防止长时间未响应的情况,在创建 WebSocket 实例时可指定超时时间[^1]。 - **错误处理**:需关注网络异常或其他可能导致断开的原因,并提供重连机制以增强稳定性。 - **跨域问题**:确保服务端配置支持 CORS 跨域资源共享策略[^4]。 --- #### 五、总结 以上展示了如何利用 UniApp 提供的标准方法操作 WebSocket 完成基础的功能开发。对于更复杂的项目需求,还可以引入封装好的工具类简化重复劳动,提高效率。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值