app消息推送的详细实现教程

实现的主要思想

app实现消息推送，利用的是第三方的个推平台，后端将需要推送的内容通过第三方个推服务器传递给手机端。
在这里插入图片描述

具体前端打包配置

在这里插入图片描述
根据上图可知，采用的打包软件是Hbuilder X,在模块配置的时候，勾选push模块中的uniPush。点击配置进入个推的官网创建项目的个推应用，具体配置如下：

1.首先在开发者中心创建一个应用，并且点击进入该应用进行更多详细配置

在这里插入图片描述
2.下面这个过程主要是开通uni Push这个应用，包名需要自己创建。

说明： 应用签名的获取方式：链接: link。获取的结果指定为：

3.我们需要的重要的信息就是配置管理中的应用配置

注意： 后台利用AppID、AppKey和AppSecret将需要传递的数据发送个推服务器。应用表示的说明如下，这里的Android包名就是我们刚刚生成的应用标识。
在这里插入图片描述
总结： 执行完成上述打包过程后，手机端就是可以实现接受推送的消息。

需要区分权限实现消息的推送的实现方式

在这里插入图片描述
1.主要的实现思路：下载软并且安装成功后，个推服务器会给应用发送一个唯一的标识，当软件卸载的时候，重新下载该应用，唯一的标识会发生改变，因为该唯一标识只与该设备和应用有关，上图中的clientid就是这个唯一标识，我们利用这个唯一标识可以绑定指定的账号信息，从而实现我们想要区分不同权限的用户信息来实现消息推送。
2.vue框架下如何获取clientid，在App.vue文件的created（）执行该函数

        //消息推送onLaunch: function (){// 获取客户端标识cid并保存到localstorage中//需要说明的是localstorage的存储的，是永久的，空间大小为5M，除非将应用卸载，不然在localstorage的数据依然存在。//获取clientid的指定函数document.addEventListener( "plusready", () => {this.cid = plus.push.getClientInfo().clientid;localStorage.cid = this.cid;console.log("this.cid: ", this.cid)/* 5+  push 消息推送 ps:使用:H5+的方式监听，实现推送*///这个函数就是实现消息推送，弹窗中的msg内容就是通过这个函数获得plus.push.addEventListener("click", (msg) => {    this.$router.push({ name: "Home" })}, false);}, false);}