【报Bug】App端 mqtt使用报错 [Vue warn]: Error in event handler for "api.onSocketTaskStateChange"

分类：uni-app

bug反馈

产品分类： uniapp/App

PC开发环境操作系统： Mac

PC开发环境操作系统版本号： mac catalina 10.15.3

手机系统： Android

手机系统版本号： Android 10

手机厂商：华为

手机机型： Mate 20

页面类型： vue

打包方式：云端

项目创建方式： CLI

CLI版本号： 27920200618002

App下载地址或H5⽹址： https://ext.dcloud.net.cn/plugin?id=854

示例代码：

参考插件市场 mqtt-demo，mqtt 引入方式改为 import mqtt from 'mqtt' 可以复现

操作步骤：

打开插件市场的mqtt-demo项目，mqtt 引入方式改为 import mqtt from 'mqtt'，运行到手机上，点下页面上的connect按钮，hbuildx控制台中会出现error信息
[Vue warn]: Error in event handler for "api.onSocketTaskStateChange": "TypeError: First argument must be a string, Buffer, ArrayBuffer, Array, or array-like object." ...

打开调试，可正常使用

预期结果：

运行不报错，可以正常接收到服务器推送的数据

实际结果：

控制台报错，不能接收到服务器推送的数据

bug描述：

在App、android 使用插件市场 mqtt-demo 中的 mqtt 版本。在微信小程序与h5中都能正常使用，在安卓端按照mqtt-demo中的方法使用异常，在socket连接成功之后报错：
[Vue warn]: Error in event handler for "api.onSocketTaskStateChange": "TypeError: First argument must be a string, Buffer, ArrayBuffer, Array, or array-like object."
(found <Root>)
TypeError: First argument must be a string, Buffer, ArrayBuffer, Array, or array-like object.

但是问题来了：当我打开调试模式的时候，就可以正常使用了。

经研究后发现报错位置在 node_modules/mqtt/lib/connect/wx.js 文件下 bindEventHandler -> socketTask.onMessage() 函数，
在socketTask.onMessage() 返回的数据中res.data一直是个空Object，导致其下方代码执行报错。

2020-07-09 15:11 负责人:无分享

3 个回复

LeoHuang

今天刚刚使用了mqtt

npm install mqtt  
var mqtt = require("mqtt/dist/mqtt");  
var client = mqtt.connect(url, opt)  
client.on("connect", () => {  
    console.log("CONNERC SUCCESS")  
})

重点就是使用的是mqtt/dist/mqtt里面的js，而不是直接require('mqtt');
另外协议是wxs或者wx，而不是wss和ws，本质上使用的是小程序的socket

1***@qq.com (作者)

非常感谢，已经找到了问题的原因了，app端中直接require('mqtt')会报错，使用打包后的库就没有问题。

2020-07-10 12:26
少点BUG

官方的mqtt-demo在H5运行正常，app真机运行就会一直触发重连

2023-02-25 10:09
8***@qq.com

回复少点BUG: app真机用wx协议，h5用ws协议

2023-03-24 11:12
1***@qq.com

回复 1***@qq.com: 可以问下怎么解决吗最近也遇到了这个问题但是报错不太一样，内置浏览器测试没问题，真机测试就报错 socketTask.onOpen is not a function 被堵住两三天了

2023-04-28 08:57