uniapp开启消息通知/提示(使用uniPush)

news2024/11/23 15:47:27

亲爱的小伙伴们,最近对uniPush有稍许研究,当前研究出一些心得,现在分项给大家,希望对大家的uniapp之路有所帮助。本次的教程是教会你如何使用uniPush自定义消息通知,同时还附带添加消息提示音添加,多的不说少的不唠,下边就让我来给你们分享一下我的经验吧。

1.首先需要我们先到Dcloud开发者中心中为你的项目配置uniPush

开发者中心传送门

接下来就是操作步骤

1.选择uniPush

2.选择消息推送

3.选择你需要使用的项目

最后填入相关信息即可 

这时候肯定会有小伙伴会问,你应用签名是咋弄来的呢,不要方,我这就教你如何获取。

1.找到侧边栏最顶部的应用管理,选择我的应用

2.点击你的应用

 然后点击修改按钮

 废话不多说,点它

点它

 然后往下翻你就会找到你想要的东西了,将它们依次填入到应用信息中相应的位置即可

 之后你回到刚刚的消息推送,你就会发现缺失的信息都有了,然后开启uniPush即可。

2.接下来需要我们开启uniPush的权限

进入我们的项目目录之后,找到manifest.json这个文件,按如下步骤即可开启uniPush权限。这边可以选择老版本1.0或则新版本2.0,我是用的1.0那个2.0没使用过,建议按照我的教程跟我一样用1.0的否则无法保证你能成功。

2.自定义消息提示图标

如果你不想用uniapp自带的那个绿油油的消息提示图标,那么建议你按照我的步骤依次先找到文件夹unpackage->res然后再res下跟我一样创建如下文件夹,然后看到步骤4中从上到下的路径依次是图片大小为18x18,24x24,36x36,48x48,72x72的带 Alpha 透明通道的 PNG 图片,背景必须是透明的(如果非透明就会显示为白色方块)。

3.创建本地消息提示添加提示音

咱们看到如下图片我有文字说明

代码如下,我比较懒,就直接复制我的了,你们自行修改好哈

						var options = {
							cover: false,
							sound: 'system',
							title: this.newNotices[i].noticeTitle,
							// 
						};
						let str = ""
						str = this.newNotices[i].noticeContent
						let body = {
							data: this.newNotices[i]
						}
						let payload = JSON.stringify(body);
						const innerAudioContext = uni.createInnerAudioContext();
						innerAudioContext.autoplay = true;
						innerAudioContext.src =
							'https://you.induschain.cn/audio/y913.mp3';
						plus.push.createMessage(str, payload, options);
					}

4.监听消息提示的点击,获取载荷payload中的数据

我想有些小伙伴可能需要像我一样从载荷中获取到数据,然后根据数据跳转到相应的详情页或其他什么页面,那么接下来就要跟我一起做。

1.找到App.vue文件

2.使用onLaunch生命周期钩子

3.注意要进行条件编译

4.对提示信息进行点击监听

5.从msg中获取到payload中的的数据

6.根据你的数据进行相关操作

代码如下,请需要的小伙伴自行按照需求修改

			// #ifdef APP-PLUS
			plus.push.addEventListener('click', function(msg) {
				//  
				// 分析msg.payload处理业务逻辑 
				// let message = JSON.parse(msg)
				let data = msg.payload.data
				uni.navigateTo({
					url: `/pages/notice-detail/notice-detail?noticeInfo=${encodeURIComponent(JSON.stringify(data))}`
				})
				// console.log("消息弹框被点击", msg.payload.data);


			});
			//#endif

教程就到这里,有问题的小伙伴可以在评论区提问哦!

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

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

相关文章

linux - ping -I 的一种异常场景处理分析

实验 用ping -I 指定一个没有配置ip地址且已经up起来的网卡。 结果 linux会根据路由规则选择一个其他网卡的ip,但,还是会从该指定网卡发送。 iputils 用-I指定网卡对应的bind操作 获取该socket的本地ip,当bind了NIC,且该NIC没有…

网络传输媒体

物理层下面的传输媒体分为两种:导向型传输媒体和非导向型传输媒体。 一、导向型传输媒体 同轴电缆: 图示: 分类: 基带同轴电缆:用于数字传输,在早期局域网中广泛使用宽带同轴电缆:用于模拟传输…

element+vue 之预览pdf组件

1.组件previewPdf <template><el-drawer:title"drawerName":visible.sync"drawerVal":direction"direction":append-to-body"true"size"100%":before-close"drawerClose"><iframe :src"url&…

前端工程化第二章:webpack5基础(中)

文章目录 1. 处理css资源&#xff08;css文件拆分 mini-css-extract-plugin&#xff09;1.1. package.json1.2. webpack.config.js 2. 处理预编译器&#xff08;less/scss&#xff09;2.1. src/index.js2.2. src/index.less2.3. src/index.scss2.4. webpack.config.js 3. 适配&…

【《机器学习和深度学习:原理、算法、实战(使用Python和TensorFlow)》——以机器学习理论为基础并包含其在工业界的实践的一本书】

机器学习和深度学习已经成为从业人员在人工智能时代必备的技术&#xff0c;被广泛应用于图像识别、自然语言理解、推荐系统、语音识别等多个领域&#xff0c;并取得了丰硕的成果。目前&#xff0c;很多高校的人工智能、软件工程、计算机应用等专业均已开设了机器学习和深度学习…

LeetCode55.Jump-Game<跳跃游戏>

题目&#xff1a; 思路&#xff1a; 大神的思路,我是不会... 代码是&#xff1a; //大神的代码code class Solution { public:bool canJump(vector<int>& nums) {int k 0;for (int i 0; i < nums.size(); i) {if (i > k) return false;k max(k, i nums[i…

Mysql群集MHA高可用配置

目录 一、MHA概述 1.简介 2.MHA 的组成 &#xff08;1&#xff09;MHA Node&#xff08;数据节点&#xff09; &#xff08;2&#xff09;MHA Manager&#xff08;管理节点&#xff09; 3.MHA的特点 二、搭建MHA高可用数据库群集 1.主从复制 &#xff08;1&#xff09;…

整车总线系列——FlexRay 六

整车总线系列——FlexRay 六 我是穿拖鞋的汉子&#xff0c;魔都中坚持长期主义的汽车电子工程师。 老规矩&#xff0c;分享一段喜欢的文字&#xff0c;避免自己成为高知识低文化的工程师&#xff1a; 没有人关注你。也无需有人关注你。你必须承认自己的价值&#xff0c;你不能…

iOS--weak的底层

怎么说 在iOS开发过程中&#xff0c;会经常使用到一个修饰词weak&#xff0c;使用场景大家都比较清晰&#xff0c;避免出现对象之间的强强引用而造成对象不能被正常释放最终导致内存泄露的问题。weak 关键字的作用是弱引用&#xff0c;所引用对象的计数器不会加1&#xff0c;并…

【自启动配置】Ubuntu 设置开机自启动脚本

Ubuntu 开机运行的脚本和当前操作系统运行的级别有关&#xff0c;OS 的运行级别大概分为七个 目录 1、查看 OS 运行级别 2、创建自启动脚本 3、添加软链接 1、查看 OS 运行级别 输入命令 runlevel 查看当前系统运行级别。当前系统的运行级别为 5 2、创建自启动脚本 在 /et…

Linux网络基础 — 数据链路层

目录 数据链路层 认识以太网 局域网转发的原理 认识以太网的MAC报头 以太网帧格式 认识MAC地址 对比理解MAC地址和IP地址 基于MAC帧协议再次谈一谈局域网转发的原理 认识MTU MTU对IP协议的影响 MTU对UDP协议的影响 MTU对于TCP协议的影响 ARP协议 ARP协议的作用 …

rust gtk 桌面应用 demo

《精通Rust》里介绍了 GTK框架的开发&#xff0c;这篇博客记录并扩展一下。rust 可以用于桌面应用开发&#xff0c;我还挺惊讶的&#xff0c;大学的时候也有学习过 VC&#xff0c;对桌面编程一直都很感兴趣&#xff0c;而且一直有一种妄念&#xff0c;总觉得自己能开发一款很好…

Rust之通用编程

1、变量与可变性&#xff1a; 在Rust语言中&#xff0c;变量默认是不可变的&#xff0c;所以一旦变量被绑定到某个值上面&#xff0c;这个值就再也无法被改变。 可以通过在声明的变量名称前添加mut关键字来使其可变。除了使变量的值可变&#xff0c;mut还会向阅读代码的人暗示…

“C++基础入门指南:了解语言特性和基本语法”

C是在C的基础之上&#xff0c;容纳进去了面向对象编程思想&#xff0c;并增加了许多有用的库&#xff0c;以及编程范式 等。熟悉C语言之后&#xff0c;对C学习有一定的帮助 文章目录 C命名风格C关键字(C98)C命名空间命名空间定义命名空间使用命名空间的使用有三种方式&#xff…

Android - 集成三方模组原厂WiFi Hal库问题

Android - 集成三方模组原厂WiFi Hal库问题 最近Android 11产品平台上需要集成三方WiFi/AP模组厂商提供的hal静态库时遇到一个问题&#xff1a;将三方的库代码集成进系统&#xff0c;并正确配置、编译出lib_driver_cmd_xxx.a(xxx一般是厂商的名字缩写&#xff0c;仅仅是个后缀用…

gazebo simulation

<?xml version"1.0" ?> <!-- --> <!-- | This document was autogenerated by xacro from /home/xrh/ros-project/gazebo_test/src/fmauch_universal_robot/ur_description/urdf/ur3_D455_2f140.urdf.xacro | --> <!-- | EDITING THIS…

C++---string

String C语言中的字符串和C中的string类标准库中的string类string类的常用接口string类对象的常见构造string类对象的容量操作string类对象的访问及遍历操作 C语言中的字符串和C中的string类 在C语言中&#xff0c;字符串是一个字符数组&#xff0c;它以空字符\0结尾&#xff…

【进程7】 2.15 有名管道介绍及使用 2.16有名管道实现简单版聊天功能

2.15 有名管道介绍及使用 有名管道&#xff08;FIFO first in first out&#xff09; 有名管道也可用于具有亲缘关系的进程之间&#xff0c;底层数据结构也是环形队列、循环队列。 有名管道的使用 unlink用于删除一个文件。 创建fifo文件 命令&#xff1a; 文件类型p&…

Android-WebRTC-双人视频

省略开启本机摄像头的过程 以下和WebSocket通信的时候&#xff0c;是通过Gson转对象为字符串的方式传输的数据 整个过程 layout_rtc.xml <?xml version"1.0" encoding"utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:and…

汽车ECU刷机笔记

汽车ECU刷机笔记 ECU简介ECU刷机的意义点火提前角点火延迟角调整意义 常见刷ECU的方法:成本价格1.通过obd汽车诊断口读写数据2.bdm后台调试模式3.BENCH刷写4.BOOT需要拆开电脑板&#xff0c;焊接电路 ECU刷写程序读取数据OBD tools(汽车诊断器)蓝牙ODB诊断器&#xff1a; 读写设…