zl程序教程

您现在的位置是:首页 >  其他

当前栏目

【TUICallKit】【uniapp小程序】全局监听(主包方案)

2023-02-26 09:46:30 时间

环境准备

【 TUICallKit 】版本须大于或等于 1.2.5

升级【 TUICallKit 】 SDK

npm i @tencentcloud/call-uikit-wechat
  • macOS 端
mkdir -p  ./wxcomponents/TUICallKit  && cp -r node_modules/@tencentcloud/call-uikit-wechat/    ./wxcomponents/TUICallKit
  • windows 端
xcopy node_modules\@tencentcloud\call-uikit-wechat .\wxcomponents\TUICallKit /i /e

构建npm

微信开发者工具创建的小程序不会默认创建 package.json 文件,因此您需要先创建 package.json 文件。新建终端,如下:

执行 npm init 命令生成 package.json 文件。

npm init -y
npm i tuicall-engine-wx

微信开发者工具 工具 > 构建 npm构建 npm 后目录如下(多了 miniprogram_npm):

1.注册页面

在 pages.json 文件 注册全局监听页面

	"pages": [ 
		{
			"path": "wxcomponents/TUICallKit/TUICallKit/pages/globalCall/globalCall_uni",
			"style": {
				"navigationBarTitleText": "uni-app",
				"usingComponents": {
					"tuicallkit": "/wxcomponents/TUICallKit/TUICallKit/TUICallKit"
				}
			}
		}
	],

2. 实例化 callManager

1.在 app.vue onLaunch 生命周期中实例化 callManager

const { CallManager } = require ('./wxcomponents/TUICallKit/TUICallKit/serve/callManager');
wx.CallManager = new CallManager();

3 触发全局监听

  wx.CallManager.init({
      sdkAppID: 123456,                 // 替换为用户自己的 sdkAppID
      userID: '123',                    // 替换为用户自己的 userID
      userSig: 'xxxxxxx',               // 替换为用户自己的 userSig
      globalCallPagePath: 'wxcomponents/TUICallKit/TUICallKit/pages/globalCall/globalCall_uni', // 替换为步骤一里注册的全局监听页面
  });

参数

类型

说明

是否必传

sdkAppID

String

IM 的应用 ID

userId

String

当前用户的 ID

userSig

String

鉴权的票据

globalCallPagePath

String

注册的全局监听页面

tim

ChatSDK

TIM 实例

推荐在登录成功后触发全局监听

卸载全局监听

wx.CallManager.destroyed()

在退出登录时,卸载全局监听,防止重复监听