首先需要uniapp项目引入腾讯云IM,app.vue需要加载腾讯云SDK并且READY。在收发消息没有问题后,监听消息并在线推送通知栏(离线需要配置厂商)

uniapp监听接收消息

写在app.vue里
onLaunch()方法内写如下:


uni.$TUIKit.on(uni.$TUIKitEvent.MESSAGE_RECEIVED,
   this.$onMessageReceived, this); // #ifdef APP-PLUS
   			//点击系统通知的推送跳转到指定的界面
   						plus.push.addEventListener("click", function(msg) {				
   							setTimeout(function() {
   								console.log('plus.push',msg)
   								uni.navigateTo({
   									url: '/pages/TUIKit/chat?name='+(msg.payload.nick?msg.payload.nick:'')+'&conversationID=C2C'+msg.payload.to+'&fromID='+msg.payload.from
   								})
   							}, 1000)
   							plus.push.clear();
   						}, false);
   						// #endif

methods里写
$onMessageReceived方法

// 收到的消息
			

$onMessageReceived(value) {
   				// 若需修改消息,需将内存的消息复制一份,不能直接更改消息,防止修复内存消息,导致其他消息监听处发生消息错误
   				console.log('$onMessageReceived',value)
   				const event = value;
   				const list = [];
   				event.data.forEach(item => { uni.$TUIKit.getMyProfile().then(res => {
   							if(item.to == res.data.userID){
   								uni.createPushMessage({
   														title:'仟籽幼儿园',
   														content:'您收到一条新消息',
   														payload:JSON.stringify(item),
   														success:(res)=> {
   															console.log(111111)
   														},
   														fail:(res)=>{
   															console.log(222)
   														}
   													})
   							}
   						})
   				}); 			},

顺便提一下如果是离线消息需要推送需要配置厂商,此时需要获取cid,以下是获取cid的方法

uni.getPushClientId({
			 		success: (res) => {
			 			console.log(res.cid);
			 		},
			 		fail(err) {
			 			console.log(err)
			 		}
			 	})

写在app.vue里,如果获取不到可以尝试延时获取等方法,或者第一次可能获取不到后面就获取到了

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐