收藏
回答

websocket延时问题

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 需求 WebSocket 客户端 6.7.2 2.0.4

功能对延时要求非常高,又需要网络通信,所以使用了websocket。


写了一个测试页面,功能很简单:定义一个变量存储要发送的数据。打开websocket连接,然后向服务端发送变量中的数据。服务端收到后会返回。当SocketTask.onMessage监听到服务端数据后,立马向服务端再次发送变量中的数据。


这样,就是发送-接收-发送-接收这样的循环。小程序这边没有任何其他逻辑处理,页面也没有使用定时器。勾选了开发者工具中的“不校验合法域名、web-view(业务域名)、TLS 版本以及 HTTPS 证书”。


然后,使用开发者工具调试,服务端进行了打印,发现从服务端返回数据到再次接收到开发者工具发来的数据,耗时在10ms以内。


然而,使用真机调试,发现这个耗时普遍在120ms以上。服务端进行了抓包和打印,发现每次小程序收到服务端返回,先给出一个tcp的确认,这个耗时很短,一般是20ms左右,但等收到小程序的websocket数据,150ms就过去了。


本来网络延时若在40ms以内,是可以满足要求的。但现在局域网就达到120ms以上,这个太高了,想请教一下为何tcp的确认明明这么快,websocket发送数据却延迟这么高?


具体开发环境为:小程序开发PC和服务端PC在同一个局域网,连接同一个路由器;微信小程序真机调试使用iPhone6S,iPhone6S没有插SIM卡,使用wifi连接同一个路由器。

调试基础库试过2.0.4和2.3.0。


附上测试代码:

Page({
    data: {
        socketTask: null,
        data: '123'
    },
    onLoad: function () {
    },
    openConnect: function () {
        let that = this;
        let socketTask = wx.connectSocket({
            url: 'ws://192.168.1.10:10002',
            success: function (res) {
                console.log("建立连接成功");
                console.log(res);
            },
            fail: function (res) {
                console.log("建立连接失败");
                console.log(res);
            }
        });
        socketTask.onOpen(function (res) {
            console.log("连接打开");
            console.log(res);
        });
        socketTask.onClose(function (res) {
            console.log("连接关闭");
            console.log(res);
        });
        socketTask.onError(function (res) {
            console.log("连接错误");
            console.log(res);
        });
        socketTask.onMessage(function (res) {
            console.log("服务端返回消息");
            console.log(res);
            that.sendMsg();
        });
        this.data.socketTask = socketTask;
    },
    closeConnect: function () {
        let socketTask = this.data.socketTask;
        if (socketTask) {
            socketTask.close({
                success: function (res) {
                    console.log("关闭接口成功");
                    console.log(res);
                },
                fail: function (res) {
                    console.log("关闭接口失败");
                    console.log(res);
                }
            });
        }
    },
    sendMsg: function () {
        let value = this.data.data;
        console.log("尝试发送消息:" + value);
        let socketTask = this.data.socketTask;
        if (this.data.socketTask) {
            socketTask.send({
                data: value,
                success: function (res) {
                    console.log("发送消息成功");
                    console.log(res);
                },
                fail: function (res) {
                    console.log("发送消息失败");
                    console.log(res);
                }
            });
        }
    }
})


回答关注问题邀请回答
收藏

4 个回答

  • 遇见
    遇见
    2021-03-12

    时隔这么久才想起来提过这个问题……后来解决了。看到还有其他同道也受该问题困扰,统一回答一下:

    关键点在于,使用真机调试的时候,不要连接PC端开发者工具。

    即:扫码进入真机调试后,关闭PC端调试工具。在微信的界面下拉找到刚才加载的小程序,进入,右上角有一个三个点的图标,点一下,下方会弹出菜单。选择其中的打开调试选项。小程序会自动退出。然后在手机端微信界面下拉,在常用小程序列表中打开刚才的小程序,进入后右下角有绿色的控制台小方块,开发即可。

    不清楚微信调试是怎么个原理,怀疑连接PC端开发者工具进行真机调试时,数据会从网络上绕一圈再回来。但只使用真机并打开调试,就不存在该问题了。

    该问题是连接PC端开发者工具导致,正式上线不会有此问题。

    2021-03-12
    有用 1
    回复
  • 海铭
    海铭
    2020-09-23

    这个问题解决了吗

    2020-09-23
    有用
    回复
  • 子非鱼安知鱼之乐
    子非鱼安知鱼之乐
    2020-05-06

    同样的问题, 期待官方能有解决办法..

    2020-05-06
    有用
    回复 1
    • 海铭
      海铭
      2020-09-23
      解决了吗
      2020-09-23
      回复
  • 戴赋坤
    戴赋坤
    2019-06-13

    关注,对即时游戏影响较大

    2019-06-13
    有用
    回复
登录 后发表内容