HTML5+ push消息推送

HTML5+ push消息推送

  • push消息推送
  • 关键 API 介绍
    • plus.push
      • addEventListener
      • clear
      • createMessage
      • getAllMessage
      • getClientInfo
      • setAutoNotification
      • remove
  • 实践
    • 消息推送
    • 开启权限

push消息推送

HTML5+ 的 Push 消息推送功能是一个强大的特性,它允许开发者在 Web 应用中实现服务端向客户端主动推送消息的能力。这种机制对于提升用户体验、实现实时通信等场景非常有用。
HTML5+ 是对 HTML5 标准的扩展,它提供了一系列增强的 API 以支持更丰富的 Web 应用功能。Push 消息推送是其中之一,它允许开发者通过特定的 API 接收来自服务端的消息,并在客户端进行展示或处理。

关键 API 介绍

plus.push

plus.push 是 HTML5+ 中用于管理推送消息的主要对象。通过它,开发者可以添加事件监听器、清空推送消息、创建本地消息、获取所有推送消息、获取客户端推送标识信息等。

addEventListener

addEventListener:添加推送消息事件监听器,支持的事件类型包括“click”(用户点击推送消息)、“receive”(应用接收到推送消息)等。

void plus.push.addEventListener( type, listener, Boolean );
  • type: ( String ) 必选 事件类型
    支持事件类型:“click”-从系统消息中心点击消息启动应用事件;“receive”-应用从推送服务器接收到推送消息事件。
  • listener: ( PushReceiveCallback ) 必选 事件监听器回调函数,在接收到推送消息时调用
  • capture: ( Boolean ) 可选 是否捕获事件,此处可忽略

clear

clear:清空所有推送消息,包括系统消息中心中的推送消息。

void plus.push.clear();

createMessage

createMessage:在本地创建推送消息,并添加到系统消息中心。

void plus.push.createMessage( content, payload, option );

参数

  • content: ( String ) 必选
    消息显示的内容,在系统通知中心中显示的文本内容。
  • payload: ( String | Object ) 可选
    消息承载的数据,可根据业务逻辑自定义数据格式。
  • options: ( MessageOptions ) 可选
    创建消息的额外参数,参考MessageOptions。

返回值
void : 无

getAllMessage

getAllMessage:获取客户端接收到的所有推送消息。 仅包括在系统消息中心显示的推送消息,不包括调用setAutoNotification(false)方法设置不显示推送消息后接收到的消息。

PushMessage[] plus.push.getAllMessage();

返回值:
PushMessage : Array[PushMessage]对象,推送消息PushMessage数组。

getClientInfo

getClientInfo:获取客户端的推送标识信息,如设备令牌(token)、推送服务令牌(clientid)等。
客户端标识信息用于业务服务器下发推送消息时提交给推送服务器的数据,用于说明下发推送消息的接收者(客户端)。 通常需要客户端在第一次运行时获取并提交到业务服务器绑定。

ClientInfo plus.push.getClientInfo();

返回值:
ClientInfo : 客户端推送标识信息对象

setAutoNotification

setAutoNotification:设置程序是否将接收到的推送消息显示在系统消息中心。

默认情况下程序在接收到推送消息后将会在系统消息中心显示,通过此方法可关闭默认行为,
接收到推送消息后不在系统消息中心显示,通过addEventListener方法的“receive”事件监听处理接收到的消息。在这种模式下可通过createMessage方法创建在系统消息中心显示的消息。
void plus.push.setAutoNotification( notify );

参数:
notify: ( Boolean ) 必选 是否自动提示推送消息
可取值true或false,true表示自动显示推送消息,false则不显示。默认值为true。
返回值:
void : 无

remove

remove:删除指定的推送消息,但 iOS 平台不支持对单条消息的删除操作。
删除系统消息中心指定的推送消息,可通过getAllMessage方法获取所有的消息后进行操作。

void plus.push.remove( message )

参数:
message: ( PushMessage ) 必选 要删除的消息对象,可通过getAllMessage()方法来获取消息。
返回值:
void : 无

实践

消息推送代码在onLaunch生命周期中监听

onLaunch: function() {isAppLunched = false// asyncClientInfo()getUserInfoAsync({connectSocket: true}).then(() => {setTimeout(() => {initPlusListener()  //消息推送initPlusPermissions()  //通知权限isAppLunched = true}, 1000)})},

消息推送

export const initPlusListener = () => {plus.push.setAutoNotification(true)  //设置了推送消息的自动通知功能// ios端 存在点击异常: https://ask.dcloud.net.cn/question/135753plus.push.addEventListener('receive', (msg) => {try {//handleAppNoticeReceive(msg)//处理接收到的消息} catch (error) {track( 'appMsgNoticeReceive', { msg, desc: '处理出错' })}}, false)plus.push.addEventListener('click', (msg) => {try {//当用户点击通知栏中的推送消息时,会触发这个事件。//在事件处理函数中,调用 handleAppNoticeClick 函数来处理点击事件。handleAppNoticeClick(msg)} catch (error) {track('appMsgNoticeClick', { msg, desc: '处理出错' })}}, false)
}
//收到透传消息    
//只有APP在线时,才会触发receive事件,透传消息不会触发系统消息,需要创建本地消息  
const handleAppNoticeReceive = (rawMsg) => {let msgPayload = {}log.info('[handleAppNoticeReceive] 收到推送消息 ', JSON.stringify(rawMsg))track( 'appMsgNoticeReceive', { rawMsg, desc: '收到推送消息' })//尝试解析消息rawMsg.payload赋给msgPayloadtry {if (typeof rawMsg.payload === 'string') { //如果是字符串msgPayload = JSON.parse(rawMsg.payload)} else if(isPlainObject(rawMsg.payload)) {  //如果是object对象msgPayload = rawMsg.payload}} catch(e) {const desc =  '解析 app 消息 msg.payload 异常'track( 'appMsgNoticeReceive', { rawMsg, desc })log.error(desc, e)	return}//从 msgPayload 中提取 data 字段,并解构出 id, shortMessage, title, type。const msgData = get(msgPayload,'data') || msgPayload || {}const { id, shortMessage, title, type } = msgData//验证 id 和 type 是否存在,以及 shortMessage 和 title 是否为空。如果验证失败,记录错误并返回。if (isUndefined(id) || isUndefined(type)) {const desc = '消息携带 data 数据中 id,type 异常'log.error(desc, msgData)	track( 'appMsgNoticeReceive', { msgData, desc })return}if (!shortMessage || !title) {const desc = '消息携带 data 数据中 shortMessage,title 异常'log.error(desc, msgData)	track( 'appMsgNoticeReceive', { msgData, desc })return}//记录解析成功的消息数据track( 'appMsgNoticeReceive', {msgData,desc: '解析 msgPayload.data 数据'})log.info('解析 msgPayload.data 数据', msgData)	// TODO: 不本地创建消息,可能存在BUG 推送太多。// plus.push.createMessage(shortMessage, rawMsg.payload, {title});  // setAppBadgeNum('message', 1); 
}
//消息点击事件    
//【APP在线】,收到透传消息通过,不会提醒至通知栏目,需要发送本地消息,再进行点击触发的点击事件。    
//【APP离线】,收到离线透传消息,必须通过Java后台的Intent字符串携带payload,且符合格式才能触发click事件,格式不符合不会触发
const handleAppNoticeClick = (rawMsg) => {//日志记录和跟踪log.info('[handleAppNoticeClick] 点击推送消息 ', JSON.stringify(rawMsg))track( 'appMsgNoticeClick', { rawMsg, desc: '点击推送消息' })//尝试解析 rawMsg.payload,如果解析失败则记录错误并返回。let msgPayload = {}try {if (typeof rawMsg.payload === 'string') {msgPayload = JSON.parse(rawMsg.payload)} else if(isPlainObject(rawMsg.payload)) {msgPayload = rawMsg.payload}} catch(e) {const desc =  '解析 app 消息 msg.payload 异常'track( 'appMsgNoticeClick', { rawMsg, desc })// 解析 app 消息 msg.payload 异常log.error(desc, e)return	}//从 msgPayload 中提取 data 字段,并解构出 ext, id, type, orgId, orgName。const msgData = get(msgPayload,'data') || msgPayload || {}const { ext, id, type, orgId = '', orgName = ''} = msgData//验证 id 和 type 是否存在。如果验证失败,记录错误并返回。if (isUndefined(id) || isUndefined(type)) {const desc = '消息携带 data 数据中 id,type 异常'log.error(desc, msgData)	track( 'appMsgNoticeClick', { msgData, desc })return}//记录解析成功的消息数据track( 'appMsgNoticeClick', {msgData,desc: '解析 msgPayload.data 数据'})log.info('解析 msgPayload.data 数据', msgData)	//解析 ext 字段,如果解析失败则记录错误并返回。(ext是从传递进来的参数里解析出来的数据)let extInfo = {}if (typeof ext === 'string' && ext !== '' && ext !== 'null') {try {extInfo = JSON.parse(ext) // TODO: 提取逻辑} catch(e) {// 解析 消息数据中 ext 信息异常const desc = '解析 消息数据中 ext 信息异常'log.error(desc, e)	track('appMsgNoticeClick', {ext, desc })return}}//根据 type(根据传递进来的参数解析出来的) 的值进行不同的页面导航,并记录相应的跟踪信息。let routeData = {}switch (type == 0) {case 0: routeData = {id,orgId,orgName}track( 'appMsgNoticeClick', { desc: '进入 bjjk', routeData })navToPage('console.alarm.detail', routeData)breakcase 1: routeData = {id,orgId,orgName,title: extInfo.modelName,...extInfo,}track( 'appMsgNoticeClick', { desc: '进入 mxjk', routeData })navToPage('console.model.detail', routeData)breakcase 2: if (extInfo.isBatch) {track( 'appMsgNoticeClick', { desc: 'gd列表' })navToPage('console.work.orgList')return}routeData = {orgId,info: {status: extInfo.status || 0,id: extInfo.ticketId,type: extInfo.ticketType}}track( 'appMsgNoticeClick', { desc: '进入 gd详情', routeData })navToPage('console.work.workDetail', routeData)break}
}

开启权限

export const initPlusPermissions = () => {try {plus.screen.lockOrientation('portrait-primary') //竖屏正方向锁定handleNoticePermission()} catch (error) {log.error('initPlusPermissions error', error)//}
}
const handleNoticePermission = () => {let type = uni.getSystemInfoSync().platformif (type === 'android') {var main = plus.android.runtimeMainActivity();var pkName = main.getPackageName();var NotificationManagerCompat = plus.android.importClass("android.support.v4.app.NotificationManagerCompat");if (NotificationManagerCompat == null) {NotificationManagerCompat = plus.android.importClass('androidx.core.app.NotificationManagerCompat');}var packageNames = NotificationManagerCompat.from(main);if (!packageNames.areNotificationsEnabled()) { //手机没有开启通知的权限uni.showModal({title: '通知管理',content: '是否允许消息推送',success: function(res) {if (res.confirm) {var uid = main.getApplicationInfo().plusGetAttribute("uid");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)其他--跳转到该应用管理的详情页var Settings = plus.android.importClass("android.provider.Settings");var Uri = plus.android.importClass("android.net.Uri");var intent = new Intent();intent.setAction(Settings.ACTION_APPLICATION_DETAILS_SETTINGS);var uri = Uri.fromParts("package", main.getPackageName(), null);intent.setData(uri);}// 跳转到该应用的系统通知设置页  main.startActivity(intent);} else if (res.cancel) {}}});}return}if (type === 'ios') {var UIApplication = plus.ios.import("UIApplication");var app = UIApplication.sharedApplication();var enabledTypes = 0;if (app.currentUserNotificationSettings) {var settings = app.currentUserNotificationSettings();enabledTypes = settings.plusGetAttribute("types");// console.log("enabledTypes1:" + enabledTypes);if (enabledTypes == 0) {plus.nativeUI.confirm("消息推送没有开启,是否去开启?", function(e) {if (e.index == 0) {var NSURL2 = plus.ios.import("NSURL");var setting2 = NSURL2.URLWithString("app-settings:");var application2 = UIApplication.sharedApplication();application2.openURL(setting2);plus.ios.deleteObject(setting2);plus.ios.deleteObject(NSURL2);plus.ios.deleteObject(application2);}}, {"buttons": ["Yes", "No"],"verticalAlign": "center"});}plus.ios.deleteObject(settings);} else {enabledTypes = app.enabledRemoteNotificationTypes();if (enabledTypes == 0) {console.log("推送未开启!");} else {console.log("已经开启推送功能!")}console.log("enabledTypes2:" + enabledTypes);}plus.ios.deleteObject(app);}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/48845.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

助燃新质生产力,魔珐科技亮相IMC2024制造业数字科技大会展示有言AIGC视频工具价值

2024年7月19日&#xff0c;IMC2024第八届制造业数字科技大会在上海盛大开幕&#xff0c;本次大会以《向“智”而行》为主题&#xff0c;250智能制造行业数字化转型企业、行业领军者及实践者共聚一堂&#xff0c;共同助力企业增强技术“硬核力”&#xff0c;为新质生产力蓄势赋能…

Matlab仿真教程

什么是仿真&#xff1f; 仿真是一种使用数学模型和算法来模拟和分析实际系统或过程的技术。仿真可以帮助我们更好地理解系统的行为、优化系统的性能和预测系统的结果。 Matlab仿真 Matlab是一种广泛使用的仿真和分析工具。它提供了丰富的函数库和工具&#xff0c;可以用来解…

buuctf web 第五到八题

[ACTF2020 新生赛]Exec 这里属实有点没想到了&#xff0c;以为要弹shell&#xff0c;结果不用 127.0.0.1;ls /PING 127.0.0.1 (127.0.0.1): 56 data bytes bin dev etc flag home lib media mnt opt proc root run sbin srv sys tmp usr var127.0.0.1;tac /f*[GXYCTF2019]Pin…

最新全新UI异次元荔枝V4.4自动发卡系统源码

简介&#xff1a; 最新全新UI异次元荔枝V4.4自动发卡系统源码 更新日志&#xff1a; 1增加主站货源系统 2支持分站自定义支付接口 3目前插件大部分免费 4UI页面全面更新 5分站可支持对接其他分站产品 6分站客服可自定义 7支持限定优惠 图片&#xff1a; 会员中心截图&…

多类支持向量机损失(SVM损失)

(SVM) 损失。SVM 损失的设置是&#xff0c;SVM“希望”每个图像的正确类别的得分比错误类别高出一定幅度Δ。 即假设有一个分数集合s[13,−7,11] 如果y0为真实值&#xff0c;超参数为10&#xff0c;则该损失值为 超参数是指在机器学习算法的训练过程中需要设置的参数&#xf…

学习并测试SqlSugar的单库事务功能

SqlSugar支持单库事务、多租户事务、多库事务&#xff0c;本文学习并测试单库事务的基本用法。   使用SqlSugarClient类、ISqlSugarClient接口都可以创建SqlSugarClient数据库操作实例&#xff0c;其区别在于&#xff0c;针对单库而言&#xff0c;SqlSugarClient类支持调用Be…

【python】NumPy运行报错分析:IndexError——数组索引越界问题

✨✨ 欢迎大家来到景天科技苑✨✨ &#x1f388;&#x1f388; 养成好习惯&#xff0c;先赞后看哦~&#x1f388;&#x1f388; &#x1f3c6; 作者简介&#xff1a;景天科技苑 &#x1f3c6;《头衔》&#xff1a;大厂架构师&#xff0c;华为云开发者社区专家博主&#xff0c;…

Android init.rc的启动流程

Android开机优化系列文档-CSDN博客 Android 14 开机时间优化措施汇总-CSDN博客Android 14 开机时间优化措施-CSDN博客根据systrace报告优化系统时需要关注的指标和优化策略-CSDN博客Android系统上常见的性能优化工具-CSDN博客Android上如何使用perfetto分析systrace-CSDN博客A…

C++中的atomic:原子

在多线程编程中&#xff0c;原子操作是一种重要的技术&#xff0c;可以确保在并发环境中进行无锁操作。C11 引入了 std::atomic<>&#xff0c;提供了一种无锁的机制来操作变量&#xff0c;确保在并发环境中访问和修改变量时没有数据竞争。本文将介绍 std::atomic<>…

HarmonyOS应用开发者高级认证,Next版本发布后最新题库 - 单选题序号1

本来打算找到工作再整理高级的题库&#xff0c;但一直没什么面试机会。宅在家里也不知道干些什么。索性就把高级的题库整理出来了。也算有头有尾。高级的题库更新之后&#xff0c;专业性更强了&#xff0c;不是真正从事这一行的&#xff0c;很难做出来。本人就是个小菜鸡&#…

【.NET全栈】ASP.NET开发Web应用——用户控件和绘图

文章目录 前言一、用户控件1、创建用户控件2、使用用户控件3、在web.config中注册用户控件4、用户控件中公开属性5、用户控件事件6、动态加载用户控件 二、动态绘图1、基本绘图2、绘制一个自定义的图片3、在Web页面放置自定义图片4、图片格式和质量5、一个Web绘图示例程序 前言…

matlab simulink气隙局部放电仿真技术研究

1、内容简介 略 87-可以交流、咨询、答疑 2、内容说明 略 为了解决目前国内外局部放电仿真方法难以计算气隙局部放电暂态过程的问题 , 利用 MATLAB (SIMULINK ) 的公共模块库和电力系统专业模块库 , 根据单气隙局部放电仿真物理模型 , 构造了气隙局部放 电仿真计算的电…

Python运算

目录 1. 算术运算符 2. 赋值运算符 3. 比较运算符 4. 逻辑运算符 5. 位运算符 6. 成员运算符 7. 身份运算符 1. 算术运算符 运算符描述示例加法a b-减法a - b*乘法a * b/除法a / b//取整除a // b%取余数a % b**幂运算a ** b 示例&#xff1a; a 10 b 3 print(a b…

打造安全堡垒:Xcode应用权限管理全解析

打造安全堡垒&#xff1a;Xcode应用权限管理全解析 在移动应用开发中&#xff0c;权限管理是确保用户数据安全和应用正常运行的关键环节。Xcode&#xff0c;作为iOS和macOS应用开发的集成环境&#xff0c;提供了一套完善的权限管理系统。本文将深入探讨Xcode中应用权限管理的策…

树状数组优化dp

这个题目怎么去想呢&#xff0c;我们先构造前缀和&#xff0c;一般思路肯定是用两层循环&#xff0c;但是一定会超时&#xff0c;我们的数据范围是 1e5&#xff0c;那我们必须找到复杂度为 nlog n 的才行&#xff0c;所以我们可以考虑每次计算以 i 结尾的子数组的数量&#xff…

移动硬盘在苹果电脑上使用后在windows中无法读取 Win和Mac的硬盘怎么通用

在日益普及的跨平台工作环境中&#xff0c;苹果电脑与Windows PC之间的数据交换成为日常需求。然而&#xff0c;用户常面临一个困扰&#xff1a;为何苹果电脑的硬盘能在macOS下流畅运行&#xff0c;却在Windows系统中变得“水土不服”&#xff1f;这一问题核心在于硬盘格式的不…

MT19937

MT19937 文章目录 MT19937题型1 逆向extract_number[SUCTF2019]MT 题型2 预测随机数[GKCTF 2021]Random 题型3逆向twist[V&N2020 公开赛]Backtrace 题型4 逆向init扩展题型WKCTF easy_random 现成模块randcrack库Extend MT19937 Predictor库 MT19937是一种周期很长的伪随机…

安全防御:过滤技术

目录 一、URL过滤 URL过滤的方式 二、HTTP与HTTPS HTTP协议获取URL的方式 HTTP协议做控制管理的流程 HTTPS 1&#xff0c;配置SSL的解密功能 2&#xff0c;直接针对加密流量进行过滤 需求&#xff1a; 三、DNS过滤 四、内容过滤 文件过滤技术 文件过滤技术的处理流…

抖音私信卡片制作教程,使用W外链创建抖音/快手/小红书卡片

在数字营销和社交媒体日益繁荣的今天&#xff0c;利用外部链接&#xff08;W外链平台&#xff09;为抖音平台创建卡片已成为一种有效的推广手段。抖音卡片不仅可以直接将观众导向目标网页或产品&#xff0c;还能提高用户的参与度和品牌的曝光度。下面&#xff0c;我们将详细介绍…