前端基于uniapp[uniPush]实现APP消息推送（安卓、IOS）

前提概述：此文章都是基于uniapp中uniPush2实现的在线、离线推送

app消息推送流程

登录开发者中心先填写好项目信息以及配置厂商
在manifest.json文件中勾选推送模块
打包自定义基座
在前端项目中创建云函数（此云函数的作用是接受后台发送的消息模板，解析出来后，发送给到uniapp后台，以此触发消息推送功能）
在app.vue文件中需要做三件事：
①获取客户端推送标识
②处理离线（推送点击）
③在线（接收消息、推送点击）
真机测试

好了，以下会根据上面的五个流程给出的具体笔记。。。

坑点

在具体讲述之前，我觉得可以把坑点先记下来，方便大家避雷：

上传iOS证书提示“证书环境错误”的问题

需要上传的是推送证书，不是打包证书

配置完成后，运行到真机会出现"打包时未添加push模块,请参考…“的情况

在manifest.json勾选了push模块之后，需要重新打包自定义基座

账号共同的问题

你在哪个开发者账号中配置的app,对应的你的HBuilder也要登录那个账号进行开发

小米真机测试，出现收不到消息的情况

需要配置推送时间

华为离线时，收不到消息推送，若厂商信息确认配置无误，那么检测以下两个地方

1、查看开发者中心 - uniPush - 应用信息，点击 [包名再“应用详情“中”各平台信息“管理，点击前往]，然后选择你的应用进行修改，一定要认真核对 Android 应用签名SHA256 是否填写正确
2、华为推送信息乱写的时候，是可能不被推送的，可以按照以下格式发送排查下：
title：订单提醒
body：您的外卖订单已接单，请耐心等候

官方排错文档

如果以上都不能帮助到你，那么再查看这两个文档进行排查：厂商限额和提醒方式说明、uni-push2.0 常见问题，如果都不行的话，只能添加unipush的客服咨询啦

具体处理笔记（从0到1）

1、在开发者中心填写项目信息以及配置厂商（见图）

2、在manifest.json文件中勾选推送模块

上传图片注意事项和格式，看文档

3、更新自定义基座

在发行->原生APP-云打包，点击打自定义调试基座。这一步，务必保证你前面的配置都好了，尤其是oppo的。

4、在前端项目中创建云函数

消息推送属于敏感操作，只能直接或间接由服务端触发。传统的三方push服务，需要开发者在服务端配置密钥或证书，根据服务器端文档签名获取token，再向相关URL接口发起网络请求…而unipush仅是需要我们创建一个云函数作为一个中转站

点击项目，右键点击创建uniCloud云开发环境，然后选择阿里云或者腾讯云
创建完成后，右键点击uniCloud选择关联空间
再右键点击cloudfunctions,选择新建云函数，新建时可选择uni-cloud-push扩展库

具体里面的内容，我们处理的不需要很多，可以具体看文档，文档写的比较详细，一直往下滑，直接看第四步

5、在app.vue处理消息

注意：安卓和IOS在线推送的情况是，是不会弹出提示的，需要我们手动创建

直接贴代码啦，具体看注释

// #ifdef APP-PLUS// 客户端获取push客户端标记uni.getPushClientId({success: async (res) => {let push_clientid = res.cid//这个id是不会改变的，我们需要在登录必经过的页面或者方法拿到这个id传给后端存储起来uni.setStorageSync('unipush_id', push_clientid)},fail(err) {console.log('推送id获取失败:', err)},})//离线推送-点击信息plus.push.addEventListener('click',async function (msg) {setTimeout(function () {uni.navigateTo({url: `/${msg.payload['path']}`,})}, 1000)plus.push.clear()},false)// 在线推送-接收信息plus.push.addEventListener('receive',function (msg) {//ios平台需要多一层判断，且拿取方式不同var platform = uni.getSystemInfoSync().platformif (platform == 'ios') {if (msg.type == 'receive') {// 这里判断触发的来源，否则一直推送。let options = { cover: false, title: msg.payload.title }plus.push.createMessage(msg.content, msg.payload.path, options)}} else if (platform == 'android') {let option = { cover: false, title: msg.title }plus.push.createMessage(msg.content, msg.payload.path, option)}},false)// 在线推送-点击信息uni.onPushMessage(async (res) => {let data = res.data.payloadif (res.type === 'click') {setTimeout(function () {uni.navigateTo({url: `/${data}`,})}, 1000)plus.push.clear()plus.runtime.setBadgeNumber(0) //清除图标右上角数字}})// #endif

6、真机测试

有两种测试方法：

后端在apipost中弄一个接口，点击发送
在开发者平台->unipush->消息推广->创建推送->透传消息
注意：
1、测试小米手机一定要填写定时推送
2、Android配置里面，initende的填写方式是（以下全部复制哦，然后再根据提示修改）：

intent:#Intent;action=android.intent.action.oppopush;launchFlags=0x14000000;component=安卓包名/io.dcloud.PandoraEntry;S.UP-OL-SU=true;S.title=测试标题;S.content=测试内容;S.payload=test;end

帮到你的话，就点个赞再走吧~

前端基于uniapp[uniPush]实现APP消息推送（安卓、IOS）相关推荐

如何构建一套高可用的 APP 消息推送平台
转载自如何构建一套高可用的 APP 消息推送平台消息推送作为移动 APP 运营中的一项关键技术,已经被越来越广泛的运用.本文追溯了推送技术的发展历史,剖析了其核心原理,并对推送服务的关键技术进行 ...
利用MUI+个推实现APP消息推送
利用MUI+个推实现APP消息推送从2015年7月开始使用MUI进行APP的开发,到现在已经有一个年头了.而以前做过的东西都没有整理过,以后会将自己遇到的坑整理下来. 这篇主要是讲利用MUI和集成的 ...
基于websocket的网页实时消息推送与在线聊天（上篇）
文章目录 @[toc] 基于websocket的网页实时消息推送与在线聊天(上篇) "使用dwebsocket在django中实现websocket" websocket原理图 d ...
MobPush，免费的APP消息推送系统
APP消息智能推送是App开发者和运营者日常工作中必备的产品功能,它的主要作用是帮助APP拉新促活,提升用户留存率和活跃度,MobPush是MobTech推出来的一款免费的APP消息推送工具,是目前市 ...
关于 APP 消息推送，看这篇文章就够辣！！
原链接:http://www.sohu.com/a/168278657_251759 APP消息推送作为消息分发渠道,一方面起到内容告知的作用,另一方面在一定程度上可以提高用户活跃,在用户流失后也许能 ...
2021年度友盟+ APP消息推送白皮书：工作日6-8点通勤时间消息送达率每日最高
移动互联网人口红利已经见顶.在激烈的流量竞争下,App内消息推送由于其能高效唤醒用户.是与用户日常互动和运营的利器而被开发者广泛关注.而推送文案则必须像磁铁,像用户心中的顶级爱豆,能牢牢吸住用户的目光 ...
IOS开发之实现App消息推送（最新）
IOS开发之实现App消息推送(最新) 标签: 推送最新AppStoreXCode6ios开发 2014-11-19 21:13 58412人阅读评论(77) 收藏举报分类: IOS ...
国内APP消息推送机制以及微信消息延迟问题剖析
转自:https://club.huawei.com/thread-15878044-1-1.html 一.前言随着安卓手机以及QQ/微信/支付宝/滴滴出行/美图外卖等一大批移动通信/移动消费应用的 ...
APP消息推送测试点
APP消息推送测试点 2019.03.15 17:38:39 字数 190 阅读 50 消息推送对象 1.单个推送 2.多个推送 3.及安卓和IOS渠道推送 ps: 注意生产环境和测试环境的分开,避免 ...