uniapp项目使用unipush2.0处理在线离线推送跳转

嘿是我呀

已于 2023-11-03 10:55:47 修改

阅读量4.4k

点赞数 2

CC 4.0 BY-SA版权

分类专栏： uniapp 文章标签： unipush2.0 uniapp 消息推送

于 2022-11-14 10:38:53 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_42998230/article/details/127842430

uniapp 专栏收录该内容

13 篇文章

订阅专栏

本文档详细介绍了如何在App中处理离线和在线推送消息的监听和响应。通过在`app.vue`中设置`uni.onPushMessage()`和`plus.push.addEventListener()`来分别处理在线和离线消息点击，特别强调了离线消息点击后的处理逻辑，需要在`onShow`方法中检查并处理。同时，为避免在线消息重复跳转，每个具体业务页面加载完成后需要清除缓存。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、在线消息：在app.vue文件onLaunch中uni.onPushMessage()监听，

2、离线消息：

由于Dcloud封装，使用固定的intent，消息点击默认只支持跳转到应用首页，不支持intent中直接给定Dcloud的插件页面路径。当用户点击通知后，会携带intent的值触发客户端click回调方法，客户端可根据接收的参数再调用客户端跳转方法实现自定义页面跳转。

所以需在plus.push.addEventListener(“click”, function(msg) {}）方法中缓存，进入首页处理；

app.vue:

<script>
	export default {
		data() {
			return {
			}
		},
		onLoad() {
		},
		onLaunch: function() {
			//离线推送点击
			plus.push.addEventListener("click", function(msg) {
				// 存储离线推送点击（此处重点处理离线点击业务，但在线也会走此方法，所以进入具体页面时需要清除缓存，否则在线消息点击进入具体页面后返回首页将会重复跳转）
				uni.setStorageSync("appLaunchedByPush", msg.payload)
			})
			// 在线推送点击
			uni.onPushMessage((res) => {
				let data=res.data.payload;
				switch (data.type) {
					case "物业管理通知":
						uni.navigateTo({
							url: `/message/detail?id=${data.buzId}&accountId=${uni.getStorageSync('accountId')}&areaId=${data.areaId}`
						});
						break;
					default:
						break;
				}
				console.log("收到推送消息：", data) //监听推送消息
				plus.runtime.setBadgeNumber(0)
			});
			
			// 获取客户端标识
			uni.getPushClientId({
				success: (res) => {
					let push_clientid = res.cid;
					uni.setStorageSync('cid', push_clientid);
				}
			})
			// #ifdef APP-PLUS
			let pinf = plus.push.getClientInfo();
			if (pinf && pinf.clientid) uni.setStorageSync('cid', pinf.clientid);
			else {
				var obtainingCIDTimer = setInterval(function() {
					pinf = plus.push.getClientInfo();
					if (pinf.clientid) {
						uni.setStorageSync('cid', pinf.clientid);
						clearInterval(obtainingCIDTimer);
					}
				}, 50);
			}
			// #endif
			plus.runtime.setBadgeNumber(0)
		},
		onShow: function() {
		},
		onHide: function() {
		},
		methods: {
		}
	}
</script>
<style lang="scss">
</style>

index.vue

<template>
	<view class="content">
	</view>
</template>
<script>
	export default {
		data() {
			return {
			}
		},
		// tabbar 的页面展现过一次后就保留在内存中，再次切换 tabbar 页面，只会触发每个页面的onShow，不会再触发onLoad。
		onShow() {
			//处理app被离线push唤醒时消息推送的跳转
			const appLaunchedByPush = uni.getStorageSync('appLaunchedByPush')
			if (!this.$isEmpty(appLaunchedByPush)) {
				switch (appLaunchedByPush.type) {
					case "物业管理通知":
						this.$u.route({
							url: `/message/detail?id=${appLaunchedByPush.buzId}&accountId=${uni.getStorageSync('accountId')}&areaId=${appLaunchedByPush.areaId}`
						});
						break;
					default:
						break;
				}
				plus.runtime.setBadgeNumber(0)
			}
		}
	}
</script>

<style lang="scss" scoped>
</style>

具体业务页面中切记清缓存

监听离线消息时，重点处理的是离线点击业务，但在线消息点击也会走此方法，所以进入特定页面时务必清除缓存，否则在线消息点击进入具体页面后返回首页时首页的缓存还在将会重复跳转

<template>
	<view v-cloak>
	</view>
</template>

<script>
	export default {
		data() {
			return {
			}
		},
		onReady() {},
		mounted() {
			//加载完成清除缓存
			uni.removeStorageSync("appLaunchedByPush");
		},
		methods: {
		}
	}
</script>

<style lang="scss" scoped>
</style>

参考文档1
参考文档2