uniapp+极光做消息推送

这里写自定义目录标题

  • 登录[极光官网](https://www.jiguang.cn/)
    • 二、安装和配置uniapp极光插件
    • 三、编写代码
    • 四、调试运行
    • 自定义基座完成后,会在项目的unpackage/debug目录生成对应的文件,安卓对应apk,iOS对应的是IPA
    • **五.运行自定义基座来测试**
    • 六、测试推送![在这里插入图片描述](https://img-blog.csdnimg.cn/4972e6dc12f04ce996ccf4d0c8c146d2.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5YiY5L-K6bi9,size_20,color_FFFFFF,t_70,g_se,x_16)

登录极光官网

1.进入【服务中心】-【开发者平台】
uniapp+极光做消息推送_第1张图片
2.创建应用:【概览】- 【创建应用】,填写应用名称和图标
uniapp+极光做消息推送_第2张图片
3.选择【消息推送】服务,点击下一步
uniapp+极光做消息推送_第3张图片
4.设置应用包名(图中仅为示例),点击下一步
uniapp+极光做消息推送_第4张图片
5.查看应用信息:点击【设置】-【应用设置】
查看AppKey和Master Secret,后续需要使用
uniapp+极光做消息推送_第5张图片

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

1. 安装JPush插件
填写好绑定的包名等
在这里插入图片描述

2. 安装JCore插件
加粗样式在这里插入图片描述
3. 导入插件到项目
uniapp+极光做消息推送_第6张图片
uniapp+极光做消息推送_第7张图片
4. 插件配置
打卡manifest.json的源码视图,找到 nativePlugins 节点
(1) 配置JG-JPUSH,设置Android和ios的应用包名
uniapp+极光做消息推送_第8张图片
(2) 配置JG-JCore,设置Android和ios的应用包名和极光官网信息的AppKey
uniapp+极光做消息推送_第9张图片

三、编写代码

在App.vue中编写如下代码:

<script>
var jpushModule = uni.requireNativePlugin("JG-JPush");

export default {
	onLaunch: function() {
		//#ifdef APP-PLUS
		jpushModule.setLoggerEnable(true);
		jpushModule.initJPushService()
		jpushModule.addConnectEventListener(result=>{
			let connectEnable = result.connectEnable
			console.log("jpush连接", connectEnable)
		})
		
		// 设置别名
		jpushModule.setAlias({
			'alias': uni.getStorageSync('userId'),
			'sequence': 1
		})
		//
		jpushModule.addTagAliasListener(result => {
			let code = result.code
			let sequence = result.sequence
			let tags = result.tags
			let tag = result.tag
			let tagEnable = result.tagEnable
			let alias = result.alias
			console.log(alias, '别名')
		})
		// 通知事件回调
		jpushModule.addNotificationListener(result => {
			let notificationEventType = result.notificationEventType
			let messageID = result.messageID
			let title = result.title
			let content = result.content
			let extras = result.extras
			console.log("通知", result)
			// 点击事件
			if (notificationEventType == 'notificationOpened') {
				uni.navigateTo({
					url: '/pages/daibanliebiao/daibanliebiao'
				})
			}
		})
		jpushModule.getRegistrationID(result => {
			console.log("注册ID", result.registerID)
			if (result.registerID) {
				uni.setStorageSync("register_id", result.registerID)
			}
		})
		jpushModule.addCustomMessageListener(result => {
			let messageID = result.messageID
			let content = result.content
			let extras = result.extras
			console.log("自定义消息", result)
		})
		//#endif
	},
};
</script>

四、调试运行

自定义基座,打包来测试
解释一下:平时我们测试,链接手机直接运行,他会在手机上安装一个APP,这个时候可以直接打开调试,这个被称为标准基座;标准基座包含了uniapp基础的一些框架内部的东西,但是如果我们要调试第三方的插件SDK,就需要自定义基座;
简单来说,自定义基座就是标准基座 + 第三方的插件SDK组成,执照方法如下:(截图用的是Mac电脑演示,Windows也类似哈)
1.点击运行,选择自定义基座:

2.安卓自定义基座流程
1.填写对应安卓的包名(和购买、极光推送配置的保持一致),三个地方的2.包名必须一致!!!
2.如果使用自有证书,则填写相关的信息
3.如果是公共测试证书,直接下一步
uniapp+极光做消息推送_第10张图片
3.iOS自定义基座流程
uniapp+极光做消息推送_第11张图片

自定义基座完成后,会在项目的unpackage/debug目录生成对应的文件,安卓对应apk,iOS对应的是IPA

**

五.运行自定义基座来测试

1.运行前,先选择运行自定义基座;点击运行-运行手机或模拟器-选择运行基座

2.点击运行,选择自己的设备

**

六、测试推送uniapp+极光做消息推送_第12张图片

点击【发送预览】并确认
uniapp+极光做消息推送_第13张图片
uniapp+极光做消息推送_第14张图片
uniapp+极光做消息推送_第15张图片

你可能感兴趣的:(uni-app)