uni-app websocket 连接失败返回报错为空

发布于 1周前 作者 yuanlaile 来自 Uni-App

uni-app websocket 连接失败返回报错为空

WebSocket 示例代码

uni.connectSocket({
  url: "ws://192.168.0.10:82/stream?token=AakLp1OCoI7qHt8", // 替换为正确的 WebSocket URL
  method: 'GET',
  success: (e) => {
    console.log(e);
    console.log('WebSocket 请求已发送');
  },
  fail: (err) => {
    console.log('WebSocket 请求失败', err);
  }
});

uni.onSocketOpen(() => {
  console.log('WebSocket 连接成功!');
  // 连接成功后可以发送消息或进行其他操作
});

// 监听 WebSocket 错误事件
uni.onSocketError((err) => {
  console.log('WebSocket 连接失败', err);
});

// 监听 WebSocket 消息
uni.onSocketMessage((message) => {
  console.log('收到服务器消息:', message);
});

控制台输出

14:48:32.953 WebSocket 请求已发送 at pages/index/index.vue:114
14:48:32.957 WebSocket 连接失败,  [Object] {}  at pages/index/index.vue:122

问题

请问有什么解决方式吗?


1 回复

在开发使用uni-app进行WebSocket连接时,如果遇到连接失败但返回报错为空的情况,通常可能是因为错误处理机制没有正确设置,或者是WebSocket连接过程中某些异常没有被捕获。下面我将提供一个示例代码,展示如何在uni-app中正确设置WebSocket连接,并处理连接失败的情况。

WebSocket连接示例代码

// 在页面的script部分定义一个WebSocket实例
let socket;

export default {
    data() {
        return {
            wsUrl: 'wss://your-websocket-server-url', // 替换为你的WebSocket服务器地址
        };
    },
    onLoad() {
        this.initWebSocket();
    },
    methods: {
        initWebSocket() {
            // 创建WebSocket实例
            socket = uni.connectSocket({
                url: this.wsUrl,
                success: (res) => {
                    console.log('WebSocket连接成功', res);
                    // 这里可以执行一些连接成功后的初始化操作
                },
                fail: (err) => {
                    console.error('WebSocket连接失败', err); // 确保错误被打印出来
                    // 可以在这里处理连接失败的情况,比如重试连接或者给用户提示
                }
            });

            // 监听连接打开事件
            socket.onOpen((res) => {
                console.log('WebSocket连接已打开', res);
                // 可以在这里发送一些初始化消息给服务器
            });

            // 监听连接错误事件
            socket.onError((err) => {
                console.error('WebSocket连接错误', err); // 确保连接过程中的错误被捕获并打印
            });

            // 监听连接关闭事件
            socket.onClose((res) => {
                console.log('WebSocket连接已关闭', res);
                // 可以在这里进行重连操作或者清理资源
            });

            // 监听接收消息事件
            socket.onMessage((message) => {
                console.log('收到服务器消息', message);
                // 处理服务器发送的消息
            });
        },
        // 其他页面方法...
    },
    onUnload() {
        // 页面卸载时关闭WebSocket连接
        if (socket) {
            socket.close();
        }
    }
};

说明

  1. 错误处理:在uni.connectSocketfail回调中处理连接失败的情况,确保任何连接错误都能被捕获并打印出来。
  2. 事件监听:通过socket.onOpensocket.onErrorsocket.onClose等方法监听WebSocket的不同状态,确保能够捕获和处理连接过程中的各种事件。
  3. 资源清理:在页面卸载时通过socket.close()关闭WebSocket连接,避免资源泄露。

通过上述代码,你应该能够更清晰地了解如何在uni-app中处理WebSocket连接,并确保在连接失败时能够获取到具体的错误信息。

回到顶部