uniapp对接极光推送(国内版以及海外版)

勾选push,但不要勾选unipush

国内版

网址:极光推送-快速集成消息推送功能,提升APP运营效率 (jiguang.cn)

  • 进入后台,并选择对应应用开始配置
  • 配置安卓包名 以及ios推送证书,是否将生产证书用于开发环境选择是
  • ios推送证书获取

参考文档:iOS 证书设置指南 (engagelab.com)

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

插件市场:DCloud 插件市场

  • 打开manifest.json导入插件到项目
  • 在源码视图进行插件配置
  • App.vue示例代码

示例代码地址:jpush-hbuilder-plugin/JPush_Hbuilder_Demo/App.vue at master · jpush/jpush-hbuilder-plugin · GitHub

javascript 复制代码
<script>
	var jpushModule = uni.requireNativePlugin("JG-JPush")
	export default {
		onLaunch: function() {
			console.log('App Launch')
			if(uni.getSystemInfoSync().platform == "ios"){
				// 请求定位权限
				let locationServicesEnabled = jpushModule.locationServicesEnabled()
				let locationAuthorizationStatus = jpushModule.getLocationAuthorizationStatus()
				console.log('locationAuthorizationStatus',locationAuthorizationStatus)	
				if (locationServicesEnabled == true && locationAuthorizationStatus < 3) {
					jpushModule.requestLocationAuthorization((result)=>{
						console.log('定位权限',result.status)
					})
				};
				
				
				jpushModule.requestNotificationAuthorization((result)=>{
					let status = result.status
					if (status < 2) {
						uni.showToast({
							icon: 'none',
							title: '您还没有打开通知权限',
							duration: 3000
						})
					}
				});

				jpushModule.addGeofenceListener(result=>{
					let code = result.code
					let type = result.type
					let geofenceId = result.geofenceId
					let userInfo = result.userInfo
					uni.showToast({
						icon: 'none',
						title: '触发地理围栏',
						duration: 3000
					})
				});
				
				// 监听deviToken的状态
				jpushModule.addDeviceTokenListener(result=>{
					let code = result.code
					if (code == 0) {
						let deviceToken = result.deviceToken
						uni.showToast({
							icon: 'none',
							title: deviceToken,
							duration: 3000
						})
						console.log("deviceToken:", deviceToken)
					}else {
						let error = result.msg
					}
				})
			
			};
			
			jpushModule.initJPushService();
			jpushModule.setLoggerEnable(true);
			jpushModule.addConnectEventListener(result=>{
				let connectEnable = result.connectEnable
				uni.$emit('connectStatusChange',connectEnable)
			});
			
			jpushModule.addNotificationListener(result=>{
				let notificationEventType = result.notificationEventType
				let messageID = result.messageID
				let title = result.title
				let content = result.content
				let extras = result.extras
				
				uni.showToast({
					icon: 'none',
					title: JSON.stringify(result),
					duration: 3000
				})
			});
			
			jpushModule.addCustomMessageListener(result=>{
				let type = result.type
				let messageType = result.messageType
				let content = result.content
				uni.showToast({
					icon: 'none',
					title: JSON.stringify(result),
					duration: 3000
				})
			});
			 jpushModule.addInMessageListener(result=>{
            				uni.showToast({
            					icon:'none',
            					title: JSON.stringify(result),
            					duration: 3000
            				})
            			});
			jpushModule.addLocalNotificationListener(result=>{
				let messageID = result.messageID
				let title = result.title
				let content = result.content
				let extras = result.extras
				uni.showToast({
					icon: 'none',
					title: JSON.stringify(result),
					duration: 3000
				})
			})
			
		},
		onShow: function() {
			console.log('App Show')
		},
		onHide: function() {
			console.log('App Hide')
		}
	}
</script>
  • 真机调试运行(需制作自定义调试基座)

标准基座只包含了uniapp基础的一些框架内部的东西,但是如果我们要调试第三方的插件SDK,就需要自定义基座

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

离线推送

离线接收消息是必须要配置厂商通道

获取厂商通道文档地址:厂商通道参数申请指南 - 极光文档 (jiguang.cn)

三星手机离线推送怎么配置

配置fcm通道

推荐Java生成

海外版

官网地址:海外消息推送_海外消息推送服务_海外推送服务平台_Engagelab

与国内版类似,不同的是插件变了

  • 在源码视图进行插件配置
  • App.vue示例代码

demo示例:engagelab-uniapp-plugin/MTPush_Hbuilder_Demo/App.vue at main · DevEngageLab/engagelab-uniapp-plugin · GitHub

javascript 复制代码
<script>
	var mtpushModule = uni.requireNativePlugin("EL-MTPush")
	export default {
		onLaunch: function() {
			console.log('App Launch')
			if(uni.getSystemInfoSync().platform == "ios"){
				
				mtpushModule.requestNotificationAuthorization((result)=>{
					let status = result.status
					if (status < 2) {
						uni.showToast({
							icon: 'none',
							title: '您还没有打开通知权限',
							duration: 3000
						})
					}
				})
			}
			
			// mtpushModule.setCountryCode("US");
			// mtpushModule.setTcpSSL(true)
			mtpushModule.setSiteName("Singapore");
			mtpushModule.setLoggerEnable(true);
			mtpushModule.initPushService();
			mtpushModule.addConnectEventListener(result=>{
				let connectEnable = result.connectEnable
				uni.$emit('connectStatusChange',connectEnable)
			});
			
			mtpushModule.addNotificationListener(result=>{
				let notificationEventType = result.notificationEventType
				let messageID = result.messageID
				let title = result.title
				let content = result.content
				let extras = result.extras
				
				uni.showToast({
					icon: 'none',
					title: JSON.stringify(result),
					duration: 3000
				})
			});
			
			mtpushModule.addCustomMessageListener(result=>{
				let type = result.type
				let messageType = result.messageType
				let content = result.content
				uni.showToast({
					icon: 'none',
					title: JSON.stringify(result),
					duration: 3000
				})
			});
			
			mtpushModule.addTagAliasListener(result=>{
				uni.showToast({
					icon: 'none',
					title: JSON.stringify(result),
					duration: 3000
				})
			});
			
			if(uni.getSystemInfoSync().platform == "ios"){
				mtpushModule.addLocalNotificationListener(result=>{
					let messageID = result.messageID
					let title = result.title
					let content = result.content
					let extras = result.extras
					uni.showToast({
						icon: 'none',
						title: JSON.stringify(result),
						duration: 3000
					})
				})
			}
			
			
		},
		onShow: function() {
			console.log('App Show')
		},
		onHide: function() {
			console.log('App Hide')
		}
	}
</script>

<style>
	/*每个页面公共css */
</style>

api

api地址:

jpush-hbuilder-plugin/doc/API.md at master · jpush/jpush-hbuilder-plugin · GitHub

  • getRegistrationID

调用此 API 来取得应用程序对应的 RegistrationID

  • addNotificationListener

通过CALLBACK 的 notificationEventType字段 区分 是 通知收到 还是 点击通知

// 点击前 notificationArrived

// 点击后 notificationOpened

  • 监听连接
javascript 复制代码
uni.$on('connectStatusChange', (connectStatus) => {
					var connectStr = ''
					if (connectStatus == true) {
						connectStr = '已连接'
						getRegistrationID()
					} else {
						connectStr = '未连接'
					}
					state.connectStatus = connectStr
				})
  • 销毁连接
javascript 复制代码
uni.$off('connectStatusChange')

问题

  • 监听到了连接状态变化比较长

是网络问题,engagelab服务器在海外,耗时是正常的

相关推荐
海晨忆14 分钟前
【Vue】v-if和v-show的区别
前端·javascript·vue.js·v-show·v-if
JiangJiang39 分钟前
🚀 Vue人看React useRef:它不只是替代 ref
javascript·react.js·面试
1024小神44 分钟前
在GitHub action中使用添加项目中配置文件的值为环境变量
前端·javascript
龙骑utr1 小时前
qiankun微应用动态设置静态资源访问路径
javascript
Jasmin Tin Wei1 小时前
css易混淆的知识点
开发语言·javascript·ecmascript
齐尹秦1 小时前
CSS 列表样式学习笔记
前端
wsz77771 小时前
js封装系列(一)
javascript
Mnxj1 小时前
渐变边框设计
前端
用户7678797737321 小时前
由Umi升级到Next方案
前端·next.js
快乐的小前端1 小时前
TypeScript基础一
前端