uni-app uni.connectSocket链接成功但不调用onOpen和onSocketOpen

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

uni-app uni.connectSocket链接成功但不调用onOpen和onSocketOpen

产品分类

uniapp/App

开发环境信息

项目 信息
PC开发环境操作系统 Windows
PC开发环境版本号 10
HBuilderX类型 正式
HBuilderX版本号 4.36
手机系统 Android
手机系统版本号 Android 10
手机厂商 华为
手机机型 MI MAX
页面类型 vue
vue版本 vue3
打包方式 云端
项目创建方式 HBuilderX

示例代码

var socketTask = uni.connectSocket({
  url: 'ws://192.168.0.109:9100',
  // url: 'http://192.168.0.109:9100',
  // url: '192.168.0.109:9100',
  success(e) {
    console.log('成功', e);
  },
  fail(e) {
    console.log('失败', e);
  },
  complete(e) {
    console.log('结束', e);
  }
});

socketTask.onMessage(e => {
  console.log('服务器回调数据', e);
});

socketTask.onOpen(e => {
  console.log('服务器打开回调', e);
});

socketTask.onClose(e => {
  console.log('服务器关闭回调', e);
});

socketTask.onError(e => {
  console.log('服务器错误回调', e);
});

uni.onSocketOpen(function (res) {
  console.log('打开回调', res);
});

uni.onSocketClose(function (e) {
  console.log('关闭回调', e);
});

操作步骤

var socketTask = uni.connectSocket({
  url: 'ws://192.168.0.109:9100',
  // url: 'http://192.168.0.109:9100',
  // url: '192.168.0.109:9100',
  success(e) {
    console.log('成功', e);
  },
  fail(e) {
    console.log('失败', e);
  },
  complete(e) {
    console.log('结束', e);
  }
});

socketTask.onMessage(e => {
  console.log('服务器回调数据', e);
});

socketTask.onOpen(e => {
  console.log('服务器打开回调', e);
});

socketTask.onClose(e => {
  console.log('服务器关闭回调', e);
});

socketTask.onError(e => {
  console.log('服务器错误回调', e);
});

uni.onSocketOpen(function (res) {
  console.log('打开回调', res);
});

uni.onSocketClose(function (e) {
  console.log('关闭回调', e);
});

预期结果

onSocketOpen 或 onOpen 有回调

实际结果

onSocketOpen 或 onOpen 无回调

bug描述

uni.connectSocket 的url 填写三种格式：ip:port、http://ip:port、ws://ip:port，在success中都提示成功，但是 onOpen 和 uni.onSocketOpen 都不回调


Harmonyos Next教程
9 回复

success代表这个接口调用成功，不代表连接成功了！你在浏览器控制台看看连接的状态是啥，看看onError里面是否抛出了异常信息


都没有信息，onOpen、onError、onSocketOpen 这三个都没有回调信息

回复 1***@qq.com: 那就只能在控制台看看了，看看连接信息和状态是啥

回复 靐齉齾麤龖龗: 大佬，我是小白一枚，咋从控制台看链接信息和状态？

回复 1***@qq.com: 还有个onClose你看看有没有回调呢

回复 靐齉齾麤龖龗: 美誉 OnSocketError 也没有回调

版本是最新的4.44吧？？？

排查自己socket服务，我这里测试换成其他正常的socket服务是可以正常监听到回调信息的

在处理 uni-app 的 uni.connectSocket 方法时，如果连接成功但未调用 onOpen 或 onSocketOpen 回调，通常意味着事件监听可能没有正确设置，或者存在某些异步逻辑上的错误。下面是一个完整的示例，展示了如何正确设置 WebSocket 连接并监听打开事件。

首先，确保你已经在 manifest.json 中配置了网络请求的合法域名（如果服务器域名不在白名单中，将无法进行网络请求）。

接下来是代码示例：

// 在页面的 onLoad 或其他合适的生命周期函数中初始化 WebSocket 连接
onLoad() {
    this.initSocket();
},

methods: {
    initSocket() {
        // 创建 WebSocket 连接
        const that = this;
        uni.connectSocket({
            url: 'wss://example.com/socket', // 替换为你的 WebSocket 服务器地址
            success: function () {
                console.log('WebSocket连接已打开');
                // 在这里可以发送一些初始化消息等
            },
            fail: function (err) {
                console.error('WebSocket连接失败', err);
            }
        });

        // 监听打开事件
        uni.onSocketOpen(function (res) {
            console.log('WebSocket 已通过 onSocketOpen 回调打开', res);
            // 连接打开后可以进行一些操作，比如发送认证信息
            that.sendAuthMessage();
        });

        // 监听消息事件
        uni.onSocketMessage(function (res) {
            console.log('收到服务器内容：' + res.data);
            // 处理接收到的消息
        });

        // 监听错误事件
        uni.onSocketError(function (err) {
            console.error('WebSocket 错误', err);
        });

        // 监听关闭事件
        uni.onSocketClose(function (res) {
            console.log('WebSocket 已关闭！', res);
            // 可以尝试重连等逻辑
        });
    },

    sendAuthMessage() {
        // 发送认证信息或其他初始化数据
        uni.sendSocketMessage({
            data: JSON.stringify({
                action: 'auth',
                token: 'your_auth_token'
            })
        });
    }
}

在这个示例中，我们首先调用 uni.connectSocket 方法尝试建立 WebSocket 连接，并在 success 回调中记录连接成功的日志。然后，我们使用 uni.onSocketOpen 监听连接打开事件，一旦连接打开，执行相应的操作，比如发送认证信息。同时，我们还监听了消息、错误和关闭事件，以便处理不同的 WebSocket 状态。

请确保你的 WebSocket 服务器地址正确无误，并且服务器能够正确处理 WebSocket 连接和消息。如果问题仍然存在，请检查服务器端的日志，看看是否有关于连接被拒绝或错误的详细信息。

回到顶部