Web/uni-app/小程序

更新时间: 2024/05/21 13:51:32

网易云信 IM SDK(NetEase Instant Messaging SDK,NIM SDK)为 Web 环境 SDK,提供完善的即时通信功能开发能力,屏蔽其内部复杂细节,对外提供较为简洁的 API 接口,方便您快速集成即时通信功能。

本文介绍如何快速将 NIM SDK 集成到你的 Web 项目中。

支持开发环境

IE 9+、Chrome 4+、Edge 12+、Firefox 11+、Safari 5+、uni-app、微信、阿里、百度、抖音小程序等。

集成 SDK

集成步骤

  1. 通过如下 npm 命令安装最新版 SDK。
npm install nim-web-sdk-ng@">=10"
  1. 通过 import 或者 require 引入入口模块。根据开发环境不同,你应该选择不同的产物。目前产物包括:
业务场景 需引入的模块 初始化方法
IM 浏览器 NIM_BROWSER_SDK NIM.getInstance
IM UniApp NIM_UNIAPP_SDK NIM.getInstance
IM 小程序 NIM_MINIAPP_SDK NIM.getInstance
Chatroom 浏览器 CHATROOM_BROWSER_SDK CHATROOM.newInstance
Chatroom UniApp CHATROOM_UNIAPP_SDK CHATROOM.newInstance
Chatroom 小程序 CHATROOM_MINIAPP_SDK CHATROOM.newInstance
  • 若开发环境为浏览器,你应该按照下面的路径引入:
// 引入方式一:引入默认路径
import NIM from 'nim-web-sdk-ng'
// 引入方式二:指定引入路径。该路径等效于默认路径
import NIM from 'nim-web-sdk-ng/dist/v2/NIM_BROWSER_SDK'
  • 若开发环境为uni-app,你应该按照下面的路径引入:
import NIM from 'nim-web-sdk-ng/dist/v2/NIM_UNIAPP_SDK'
  • 若开发环境为小程序,由于小程序构建 npm 之后,只有默认路径文件才会被复制到 miniprogram_npm 中,而IM SDK 小程序包不是默认路径。因此,我们需要将 nim-web-sdk-ng/dist/v2 拷贝到项目的其它目录中,然后引入:
import NIM from '{相对路径}/NIM_MINIAPP_SDK'

后续步骤

完成 SDK 集成后,需初始化登录 IM

相关信息

实例调用方式

将 NIM SDK 集成到客户端后,需要先完成 NIM 实例的初始化才能使用其他功能。

本文主要介绍 NIM_BROWSER_SDK 的初始化。示例代码如下:

  • 浏览器环境,及运行在非小程序的 uni-app 环境,使用下面方式初始化:
typescriptconst nim = NIM.getInstance({
    appkey: "YOUR_APPKEY",
    debugLevel: "debug"
    apiVersion: "v2"
})
  • 小程序环境,及运行在小程序的 uni-app 环境,使用下面方式初始化。之所以小程序需要和非小程序区分,是因为小程序需要设置域名白名单,因此需要返回固定域名的 lbs 请求地址
typescriptconst nim = NIM.getInstance({
    appkey: "YOUR_APPKEY",
    debugLevel: "debug"
    apiVersion: "v2"
}, {
  V2NIMLoginServiceConfig: {
    "lbsUrls": [
      "https://lbs.netease.im/lbs/wxwebconf.jsp"
    ],
    "linkUrl": "wlnimsc0.netease.im"
  }
})
  • 下面代码演示如何登录,以及通过 onLoginStatus 事件来监听登录状态变化
javascriptnim.V2NIMLoginService.on('onLoginStatus', function(arg1) {
  console.log('收到 V2NIMLoginService 模块的 onLoginStatus 事件', arg1)
})
await nim.V2NIMLoginService.login("YOUR_ACCOUNT", "YOUR_TOKEN")
  • 登录后,发送点对点消息:
javascriptconst message = nim.V2NIMMessageCreator.createTextMessage("hello")
const res = await nim.V2NIMMessageService.sendMessage(message, 'YOUR_ACCOUNT|1|RECEIVER_ACCOUNT')
此文档是否对你有帮助?
有帮助
去反馈
  • 支持开发环境
  • 集成 SDK
  • 集成步骤
  • 后续步骤
  • 相关信息
  • 实例调用方式