集成 SDK - IM 即时通讯(Web 含圈组)

开发者中心

IM 即时通讯(Web 含圈组)

集成开发

集成 SDK

更新时间： 2024/07/18 16:21:34

本文介绍如何将支持了小程序平台的 NIM Web SDK（含圈组）集成到您的微信或支付宝小程序项目。

SDK 简介

NIM Web SDK（含圈组版）为 NIM Web SDK （以下简称为“原版”）的重构版本。含圈组版继承了原版的特性，提供完善的即时通讯功能开发框架和简洁的 API 接口，方便您快速将即时通讯功能集成到您的 PC/移动 Web 应用及 NodeJS、微信小程序等跨平台应用。

相较于原版，含圈组版做了如下改进：

使用 TypeScript 重构（TypeScript 完全兼容 JavaScript 语法），API 出入参数定义更加完善。
使用 Promise API 替代回调函数。
支持更多开发环境：现支持 IE v11.0.0 及以上版本和 chrome v4.0.0 及以上版本等浏览器，以及微信小程序、支付宝小程序、uni-app 等跨平台开发环境。

结构更精简。包体积降至原版 SDK 的 40%。

小程序不支持 TypeScript，目前仅支持在浏览器环境导出 TypeScript 声明。
暂未支持百度小程序和字节跳动小程序。

前提条件

开始集成前，请确保已在微信公众平台中进入小程序后台 > 开发 > 开发设置 > 服务器域名，将以下域名填入指定的 “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 必需
socket 合法域名	wss://wlnimsc1.netease.im	聊天室必需
uploadFile 合法域名	https://nos.netease.com https://fileup.chatnos.com https://oss.chatnos.com	文件上传，如发送文件类消息
downloadFile合法域名	https://nim-nosdn.netease.im https://nim.nosdn.127.net	文件下载，如下载语音

集成步骤

(可选) 步骤1：新建项目

新建小程序项目。如果需要集成到已有项目，请忽略本步骤。

步骤2：安装 SDK

SDK 以 npm 包的形式提供，请前往 nim-web-sdk-ng 获取 npm 包。

通过以下命令安装 SDK。

npm install nim-web-sdk-ng@latest

SDK 结构如下：

dist/
├── CHATROOM_BROWSER_SDK.js  聊天室浏览器适配版 UMD 格式
├── CHATROOM_MINIAPP_SDK.js  聊天室小程序适配版 UMD 格式
├── CHATROOM_UNIAPP_SDK.js   聊天室 UNIAPP 适配版 UMD 格式
├── NIM_BROWSER_SDK.js       IM 浏览器适配版 UMD 格式
├── NIM_MINIAPP_SDK.js       IM 小程序适配版 UMD 格式
├── NIM_UNIAPP_SDK.js        IM UNIAPP 适配版 UMD 格式
├── QCHAT_BROWSER_SDK.js     圈组浏览器适配版 UMD 格式

这里的小程序适配版，仅支持微信和支付宝小程序。

步骤3：引入 SDK

微信小程序

按需将 node_modules/nim-web-sdk-ng/dist/NIM_MINIAPP_SDK，或者 node_modules/nim-web-sdk-ng/dist/CHATROOM_MINIAPP_SDK 拷贝到项目路径中，比如放到 utils 文件。
在文件中引入 IM SDK。如果只需要 NIM 则引入 NIM_MINIAPP_SDK，如果只需要聊天室能力则引入 CHATROOM_MINIAPP_SDK。
```
// IM
const NIM = require('utils/NIM_MINIAPP_SDK')

// 聊天室
const Chatroom = require('utils/Chatroom_MINIAPP_SDK')
```

支付宝小程序

打开 mini.project.json，添加如下配置：

"node_modules_es6_whitelist": [ 
    "nim-web-sdk-ng"
]

在代码中引入 IM SDK。如果只需要 NIM 则引入 NIM_MINIAPP_SDK，如果只需要聊天室能力则引入 CHATROOM_MINIAPP_SDK。

// IM
const NIM = require('nim-web-sdk-ng/dist/NIM_MINIAPP_SDK')

// 聊天室
const Chatroom = require('nim-web-sdk-ng/dist/Chatroom_MINIAPP_SDK')

后续步骤

NIM SDK 和 ChatroomSDK 需分别使用不同的初始化方法，具体参见：

常见问题

已知问题及处理建议

IM 含圈组版已兼容小程序环境，但该平台环境存在一些问题和限制，具体参见已知问题及处理建议。

npm 安装报错

Q：执行 npm 命令安装 SDK 失败，出现以下报错信息。

A：出现该问题是由用户侧环境导致，请按照提示执行 npm fund和npm audit fix即可。

此文档是否对你有帮助？

有帮助

去反馈

SDK 简介
前提条件
集成步骤
(可选) 步骤1：新建项目
步骤2：安装 SDK
步骤3：引入 SDK
后续步骤
常见问题
已知问题及处理建议
npm 安装报错