uni-app/小程序注意事项

更新时间: 2024/04/28 18:31:50

前提条件

开始集成前,请确保已在微信公众平台中进入小程序后台 > 开发 > 开发设置 > 服务器域名,将以下域名填入指定的 “request 合法域名” / “socket 合法域名” / “uploadFile 合法域名” / “downloadFile 合法域名” 中。

微信小程序必须使用该 lbs 地址: https://lbs.netease.im/lbs/wxwebconf.jsp

更多相关说明,请参见配置服务器域名

如果您需要在支付宝运行小程序,请在支付宝开发平台配置服务器域名。

配置分类 域名 说明
request 合法域名 https://lbs.netease.im 请求 LBS 地址
https://wlnimsc0.netease.im IM 必需
https://wlnimsc0.netease.im:443 IM 必需
https://wlnimsc1.netease.im 聊天室必需
https://wlnimsc1.netease.im:443 聊天室必需
https://statistic.live.126.net 数据上报
https://abt-online.netease.im 用于 A/B Test
socket 合法域名 wss://wlnimsc0.netease.im IM 必需
wss://wlnimsc1.netease.im 聊天室必需
uploadFile 合法域名 https://nos.netease.com 文件上传,如发送文件类消息
downloadFile合法域名 https://nim-nosdn.netease.im 文件下载,如下载语音

常见问题

IM 含圈组版目前兼容 uni-app 环境,但仍存在一些问题和限制。本文列举已知的问题和限制,并提供相应的处理建议。

不支持动态 LBS 地址

限制描述

uni-app 编译成微信小程序时,实例在微信小程序环境中运行,会受到域名白名单限制,无法使用 LBS 服务动态调配的长连接地址。

处理建议

初始化时,初始化参数lbsUrls只传入一个固定的 LBS 地址。

示例如下:

const nim = NIM.getInstance({
    appkey: "YOUR_APPKEY",
    debugLevel: "debug"
    apiVersion: "v2"
}, {
  V2NIMLoginServiceConfig: {
    "lbsUrls": [
      "https://lbs.netease.im/lbs/wxwebconf.jsp"
    ],
    "linkUrl": "wlnimsc0.netease.im"
  }
})

Websocket 多个连接会失效

报错信息

Error: Adapter uni-app: socket sendMsg when readyState=0

报错原因

出现以上报错,可能是由于在 uni-app 里尝试建立两个 WebSocket 连接。

uni-app 项目在真机上运行(作为 app 运行,而非 H5),websocket 多个连接会失效。2019 年 uni-app 官方社区里有了此反馈的帖子 uni-app,websocket多个连接会失效,至今尚未解决。下图为该帖子的最佳回复。

uni-app官方社区WebSocket问题最佳回复.png

处理建议

云信 IM (NIM)和 Chatroom 为两个互为独立的实例,两者各自建立与云信服务端之间的长连接。因此在编译成 uni-app 应用的模式下,请不要同时使用 NIM 和 Chatroom 两个实例。

您可分别通过NIMInterface.destroy方法和ChatroomInterface.destroy方法销毁 NIM 实例和聊天室实例,进而销毁其与云信服务端的长连接,保证只有一个实例建立长连接。

不支持分片上传

限制描述

由于读取文件有着诸多限制,无法以一种兼容性比较好的方式根据 filePath 拿到本地文件信息。单线程在上传大文件不仅体验差,而且会因为手机终端性能而出现意想不到的问题。

处理建议

在使用选择文件 API (例如chooseImagechoosevideo)时自行判断文件大小,建议 100 MB 以上的文件不传。

微信小程序编译报错 Function(...) is not a function

报错信息

uni-app 编译成微信小程序时,微信小程序上报错 Function(...) is not a function

微信小程序报错图1.png

报错原因

微信基础库版本过低。

处理建议

将微信基础库切换为 v2.21.0 以上的版本。

微信小程序编译报错 Converting circular structure to JSON

报错信息

TypeError: Converting circular structure to JSON
    --> starting at object with constructor 'i'
    |     property '_events' -> object with constructor 'n'
    |     property 'logined' -> object with constructor 'Array'
    |     index 0 -> object with constructor 'a'
    --- property 'context' closes the circle
    at JSON.stringify (<anonymous>)
    at cloneWithData (mp.runtime.esm.js?66fd:5620)

微信小程序报错图2.png

报错原因

uni-app 编译微信小程序时注入的 mp.runtime.esm.js 里,对 vue 的 data 进行序列化使用的序列化方法是 return JSON.parse(JSON.stringify(ret)),即在 vue 组件的 data 里挂载 nim 实例。然而实例继承自 EventEmitter3 对象,无法被这样序列化。

处理建议

建议将 nim 实例挂载在全局变量、vuex 的 prototype,或者参考如下示例代码在应用的globalData中挂载:

const app = getApp() 
if (app && app.globalData && app.globalData.nim) {
  app.globalData.nim = new NIMSDK()
}

微信小程序开启"将 JS 编译成 ES5"选项后,编译报错

报错信息

WAServiceMainContext.js:2 TypeError: t is not a function
    at oe.connect (NIM.js? [sm]:15)
    at Li.connect (im.js? [sm]:17)
    at Object.i.safeCallback (WASubContext.js?t=wechat&s=1642128708420&v=2.21.3:2)
    at WASubContext.js?t=wechat&s=1642128708420&v=2.21.3:2
    at br (WASubContext.js?t=wechat&s=1642128708420&v=2.21.3:2)
    at WASubContext.js?t=wechat&s=1642128708420&v=2.21.3:2
    at g (WASubContext.js?t=wechat&s=1642128708420&v=2.21.3:2)
    at WASubContext.js?t=wechat&s=1642128708420&v=2.21.3:2
    at WASubContext.js?t=wechat&s=1642128708420&v=2.21.3:2
    at WAServiceMainContext.js:2(env: Windows,mp,1.05.2111300; lib: 2.21.3)

报错原因

微信小程序环境编译到 ES5 过程中产生未知错误。

处理建议

目前请勿勾选"将 JS 编译成 ES5"选项。

集成 Web SDK 时 TypeError 报错

报错信息

TypeError: Cannot read property 'localStorage' of undefined

报错原因

未集成与环境匹配的 SDK

处理建议

  • 使用小程序开发,请集成 (NIM|CHATROOM|QCHAT)_MINIAPP_SDK.js
  • 使用 uni-app 开发,请集成 (NIM|CHATROOM|QCHAT)_UNIAPP_SDK.js
  • 使用浏览器或者 h5 开发,请集成 (NIM|CHATROOM|QCHAT)_BROWSER_SDK.js

uniapp 编译到不同端获取到的漫游消息不一致

问题描述

uniapp 编译到 iOS 端获取到的漫游消息与编译到 h5 获取到的漫游消息不一致。

问题原因

plus-websocket 插件丢包会导致 NIM SDK 收到的会话变少。

处理建议

建议去除 plus-websocket 插件。

模块包含es6语法导致上传报错

问题描述

支付宝小程序因为模块中 es6 语法报错

问题原因

node_modules 中模块包含 ES6 语法导致上传版本构建失败。

修复方式

打开 mini.project.json,添加如下配置:

"node_modules_es6_whitelist": [ 
    "nim-web-sdk-ng"
]
此文档是否对你有帮助?
有帮助
去反馈
  • 前提条件
  • 常见问题
  • 不支持动态 LBS 地址
  • 限制描述
  • 处理建议
  • Websocket 多个连接会失效
  • 报错信息
  • 报错原因
  • 处理建议
  • 不支持分片上传
  • 限制描述
  • 处理建议
  • 微信小程序编译报错 Function(...) is not a function
  • 报错信息
  • 报错原因
  • 处理建议
  • 微信小程序编译报错 Converting circular structure to JSON
  • 报错信息
  • 报错原因
  • 处理建议
  • 微信小程序开启"将 JS 编译成 ES5"选项后,编译报错
  • 报错信息
  • 报错原因
  • 处理建议
  • 集成 Web SDK 时 TypeError 报错
  • 报错信息
  • 报错原因
  • 处理建议
  • uniapp 编译到不同端获取到的漫游消息不一致
  • 问题描述
  • 问题原因
  • 处理建议
  • 模块包含es6语法导致上传报错
  • 问题描述
  • 问题原因
  • 修复方式