对接腾讯IM，实现个人业务系统页面按钮直接跳转到和用户的聊天页面（不需要加好友）

实现效果如下：

前提条件：

1、到腾讯IM控制台，创建应用，并获取应用ID和密钥

2、创建测试用户

3、根据文档下载安装SDK（我用的unipp小程序端），并设置page.json文件（page.json就是正常的设置页面路径和tabbar，我就不再做截图和示例了，腾讯的文档也有说明）

文档地址：
https://cloud.tencent.com/document/product/269/120088

4、代码目录如下（主要是TUIKit目录）：

5、index.vue即时聊天按钮方法

javascript 复制代码

/*在js顶部引入方法库*/
import {imLogin} from '@/config/api.js';
//跳转到IM聊天
methods: {
	 toChat(item) {
		console.log('跳转到聊天页面');
		//最终，这里要读取item中用户的userId字段,这里只是写死的demo
		imLogin({userId: 'user1'}, () => {
			uni.navigateTo({
				url: '/TUIKit/components/TUIChat/index'
			})
		});
	}
}

6、api.js代码如下：

javascript 复制代码

/*IM聊天相关函数--START*/
import Server from '@/TUIKit/components/TUIContact/server';
import TUICore from '@tencentcloud/tui-core-lite';
import {TUIConversationService, TUIStore, StoreName} from '@tencentcloud/chat-uikit-engine-lite';
import { TUIGlobal } from '@tencentcloud/universal-api';
import { TUILogin } from '@tencentcloud/tui-core-lite';
import { TUIChatEngine } from '@tencentcloud/chat-uikit-engine-lite';
import { genTestUserSig } from '@/TUIKit/debug';
import { SDKAppID, secretKey } from '@/config/config.js';

const TUIContactServer = Server.getInstance();
const TUIConstants = TUIContactServer.constants;

//跳转到用户聊天页面
const toUserContact = (user, userID) => {
	TUIStore.update(StoreName.CUSTOM, 'isShowSelectFriendComponent', false);
	//console.log('调试TUIContactServer：', TUIContactServer);
	//const callback = TUIContactServer.getOnCallCallback(TUIConstants.TUIContact.SERVICE.METHOD.SELECT_FRIEND);
	//callback && callback(memberList);
	//打开会话
	//let conversationId = `C2C${userID}`;  //生产环境应该使用这句代码
	let conversationId = `C2Cuser2`;  //这里写死只做demo使用
	TUIConversationService.switchConversation(conversationId).then(() => {	    
	    console.warn('打开会话成功');
		TUIGlobal?.navigateTo({
		  url: '/TUIKit/components/TUIChat/index',
		});
	}).catch((err) => {
	    console.warn('打开会话失败', err.code, err.msg);
	});
}

//检查IM中，userID是否存在
const checkUser = async (userID, callback) => {	
	const imCore = TUICore.getService(TUIConstants.TUISearch.SERVICE.NAME);
	const imResponse = await imCore.searchUser(userID);
	console.log('IM用户查询结果：', imResponse);
	if (!imResponse.data[0]) {
		callback(false);
	} else {
		callback(imResponse.data[0]);
	}
	// userList.value = imResponse.data;
	// const searchAllResult = friendList.value.filter((item : any) => item.userID === imResponse.data[0].userID);
	// friendList.value = searchAllResult.length ? friendList.value : [...friendList.value, ...userList.value];
}

//登录Im
export const imLogin = (data, callback) => {
	try {
		//生成IM签名
		const { userSig } = genTestUserSig({
			SDKAppID: SDKAppID,
			userID: data.userId,
			secretKey: secretKey,
		});
		
		//此段代码需要摞到登录的代码位置
		TUILogin.login({
			SDKAppID: SDKAppID,
			userID: data.userId,
			userSig: userSig,
			framework: 'vue2' // framework used vue2 / vue3
		}).then(() => {
			TUIChatEngine.isReady();
			//检查用户是否存在
			checkUser(data.userId, (checkUserRes) => {
				if (checkUserRes !== false) {
					// uni.switchTab({
					// 	url: '/TUIKit/components/TUIConversation/index',
					// });
					
					toUserContact(checkUserRes, data.userId)
				} else {
					uni.showToast({
						title: '未注册IM账号'
					})
				}
			});			
		}).catch((error) => {
			console.error(error);
		});
	} catch (error) {
		uni.showToast({
			title: '登录失败',
			icon: 'error'
		})
	}
}

/*IM聊天相关函数--END*/

7、config.js代码如下

javascript 复制代码

//腾讯IM即时通讯配置
export const SDKAppID = 1111111111; // Your SDKAppID
export const secretKey = 'XXXXXXXXXXXXX'; // Your secretKey```

8、用户注册系统账号时，服务端代码通过接口创建IM账号

文档地址：https://cloud.tencent.com/document/product/269/1608?from=console_document_search

最终即可实现动图示例中的效果

注意：代码示例中登陆的用户id和聊天对象的用户id都是写死的，正常应该是读取系统每个用户ID才对