uniapp对接极光推送(超详细)

前言

关于uniapp的通知栏消息推送,uniapp是有提供详细的官方解决方案的 [unipush](https://uniapp.dcloud.net.cn/unipush-v2.html#)
,有兴趣的朋友可以去研读一番。本文主要讲解个人对接极光推送时的心得经验,有需要的老铁务必仔细看,不然等自己操刀的时候可能一不小心就会出错。

一、注册极光开发者,登录进入开发者平台

  1. 进入【服务中心】=》【开发者平台】

1663140411074_1F110237-58F2-49a4-8A7A-58FC5242A31D.png

  1. 创建应用

1663140291169_ECFD0C5B-220F-4768-9209-A2CF881B0A7D.png

  1. 选择【消息推送】服务,点击下一步

1663140528868_219CBFE0-F5C7-4fc6-B503-D519260824A6.png

  1. 设置应用包名,点击下一步(Andorid)

1663140582538_D0A1F853-15E0-40f8-9852-1E6D03463111.png

  1. 设置应用证书,点击下一步(ios)

1663140889615_D19C3EE3-6448-4fa6-9ADA-E4FAC8EFC5B1.png

  1. 查看应用信息后续需要使用

1663140981891_FCD7966A-3204-4c33-9AF2-6D3AC7B8F5DA.png

二、安装和配置uniapp官方的极光插件

  1. 插件市场搜索并安装JPush插件

1663655462298_B6BA8C33-23A3-4e2e-873A-2C9B7ACEC248.png

 2. 插件市场搜索并安装JCore插件

1663655498384_F3E8C519-F54F-434d-8D49-B30A445DA63E.png

 3. 打开manifest.json导入插件到项目

1663655706818_9DDE466F-A924-4c8b-868F-2920769DF7EA.png

 4. 在源码视图进行插件配置

1663656026715_0DCBBDD4-E7A2-4140-A28A-53394CF04E65.png

1663656071217_513162A8-1FCC-48c8-A7C1-8F672192C1CF.png

三、编写代码

  • 在App.vue中编写如下代码:
<script>
	// #ifdef APP-PLUS
	var jpushModule = uni.requireNativePlugin("JG-JPush");
	var audioObj = uni.getBackgroundAudioManager();
	// #endif
	export default {
		data() {
			return {};
		},
		computed: {},
		computed: {},
		methods: {
			getRegistrationID() { //获取registerID
				jpushModule.getRegistrationID(result => {
					let registerID = result.registerID
					console.log(registerID)
					this.registrationID = registerID
					uni.setStorageSync("registerID", registerID)
				})
			},
			getNotificationEnabled() {
				if (uni.getSystemInfoSync().platform == "ios") {
					jpushModule.requestNotificationAuthorization((result) => {
						let status = result.status
						if (status < 2) {
							this.noticMsgTool()
						}
					})
				} else {
					jpushModule.isNotificationEnabled((result) => { //判断android是否打开权限
						if (result.code == 0) { //如果为0则表示 未打开通知权限 
							this.noticMsgTool()
						}
					})
				}
			},
			noticMsgTool() {
				if (uni.getSystemInfoSync().platform == "ios") {
					//苹果打开对应的通知栏
					uni.showModal({
						title: '通知权限开启提醒',
						content: '您还没有开启通知权限,无法接受到消息通知,请前往设置!',
						showCancel: false,
						confirmText: '去设置',
						success: function(res) {
							if (res.confirm) {
								var app = plus.ios.invoke('UIApplication', 'sharedApplication');
								var setting = plus.ios.invoke('NSURL', 'URLWithString:', 'app-settings:');
								plus.ios.invoke(app, 'openURL:', setting);
								plus.ios.deleteObject(setting);
								plus.ios.deleteObject(app);
							}
						}
					});
				} else {
					//android打开对应的通知栏
					var main = plus.android.runtimeMainActivity();
					var pkName = main.getPackageName();
					var uid = main.getApplicationInfo().plusGetAttribute("uid");
					uni.showModal({
						title: '通知权限开启提醒',
						content: '您还没有开启通知权限,无法接受到消息通知,请前往设置!',
						showCancel: false,
						confirmText: '去设置',
						success: function(res) {
							if (res.confirm) {
								var Intent = plus.android.importClass('android.content.Intent');
								var Build = plus.android.importClass("android.os.Build");
								//android 8.0引导  
								if (Build.VERSION.SDK_INT >= 26) {
									var intent = new Intent('android.settings.APP_NOTIFICATION_SETTINGS');
									intent.putExtra('android.provider.extra.APP_PACKAGE', pkName);
								} else if (Build.VERSION.SDK_INT >= 21) { //android 5.0-7.0  
									var intent = new Intent('android.settings.APP_NOTIFICATION_SETTINGS');
									intent.putExtra("app_package", pkName);
									intent.putExtra("app_uid", uid);
								} else { //(<21)其他--跳转到该应用管理的详情页  
									intent.setAction(Settings.ACTION_APPLICATION_DETAILS_SETTINGS);
									var uri = Uri.fromParts("package", mainActivity.getPackageName(), null);
									intent.setData(uri);
								}
								// 跳转到该应用的系统通知设置页  
								main.startActivity(intent);
							}
						}
					});
				}
			},
		},
		onLaunch() {
			// #ifdef APP-PLUS
			jpushModule.initJPushService();
			jpushModule.setLoggerEnable(true);
			plus.screen.lockOrientation("portrait-primary");
			// 设置别名
                        jpushModule.setAlias({
                                'alias': this.lxzl.getUserInfo().userId + '',
                                'sequence': 1
                        })
			//监听 极光推送连接状态
			this.getNotificationEnabled();
			jpushModule.addConnectEventListener(result => {
				let connectEnable = result.connectEnable
				uni.$emit('connectStatusChange', connectEnable)
			});
			jpushModule.addNotificationListener(result => { //极光推送的消息通知回调
				jpushModule.setBadge(0);
				plus.runtime.setBadgeNumber(0);
				let notificationEventType = result.notificationEventType
				let woopId = result.extras && result.extras.dataType === 'woop' && result.extras.value;
				console.log("通知", result, notificationEventType)
				// 点击事件
				if (notificationEventType == 'notificationOpened') {
					uni.navigateTo({
						url: '/pages/taskDetail/taskDetail?' + 'woopId=' + woopId
					});
				}
			});
			uni.$on('connectStatusChange', (connectStatus) => {
				var connectStr = ''
				if (connectStatus == true) {
					connectStr = '已连接'
					// this.getRegistrationID()
				} else {
					connectStr = '未连接'
				}
				console.log('监听到了连接状态变化 --- ', connectStr)
				this.connectStatus = connectStr
			})
			jpushModule.isPushStopped(res => {
				// code   0已停止推送  1未停止推送
				const { code } = res
				console.log(res, '安卓连接状态');
			})
			//#endif
		},
		onShow() {},
		onHide() {},
	}
</script>

四、真机调试运行(需制作自定义调试基座)

  • 注:标准基座只包含了uniapp基础的一些框架内部的东西,但是如果我们要调试第三方的插件SDK,就需要自定义基座
  • 1663657002208_86454895-3B3C-465d-B504-764E131DA1C2.png

    1663656708215_37FA920E-C8A6-4c87-BC9F-1CF4BFA63A09.png

    五、推送测试(直接通过极光后台发送)

    1663657585498_16E8DC41-CA64-43dc-B390-219B499924BA.png

    1663657479202_FAE96228-EF2A-42d5-8B13-0C43C7C08C29.png

总结

以上是uniapp集成极光服务的一个常见方式,但通过这种方式可能会存在向andriod手机推送不过去的情况。如果有小伙伴碰到这种问题,请改用通过Android Studio离线打包配置的方式集成极光推送服务,解决这一问题。具体请看我的另一篇博客 uniapp对接极光推送(Android Studio 离线打包配置)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值