使用web.dev提供的工具实现浏览器消息推送服务
文章目录
- 前言
- 实现工具和效果
- 实现原理
- 实现过程
- 前端接收用户订阅请求将用户订阅信息更新到后端
- 后端实现接收并保存订阅信息的接口
- 后端实现消息推送的逻辑
前言
对于电商独立站来说，新品上架或者促销活动上线及时通知到用户是很重要的，通知的渠道有很多，其中就包括浏览器消息推送。浏览器消息推送可以实现将自定义的浏览器通知消息（可含文字、图片、链接）推送给订阅了你网站浏览器消息的用户，这样用户打开电脑看到系统弹出的浏览器通知消息就可以点击跳转到你的活动介绍页，从而带来订单转化。
实现工具和效果
这次我们使用的浏览器消息推送工具是web.dev网站的Push notifications，网站链接：官网文档（google服务需合理上网）。消息通知在PC端和手机端的效果如下图所示：
相关文章：
使用web.dev提供的工具实现浏览器消息推送服务
文章目录 前言实现工具和效果实现原理实现过程前端接收用户订阅请求将用户订阅信息更新到后端后端实现接收并保存订阅信息的接口后端实现消息推送的逻辑前言 对于电商独立站来说，新品上架或者促销活动上线及时通知到用户是很重要的，通知的渠道有很多，其中就包括浏览器消息推…...
计算机系统结构为什么用architecture 而不是structure?
architecture本意是建筑学、建筑艺术，其含义就是建筑的样子和背后的设计思想，用于计算机科学可以表达计算机的系统结构和后面的设计原理：它长什么样？它为什么长这样？ 与architecture 对应的词是structure （…...
sqoop问题汇总记录
此篇博客仅记录在使用sqoop时遇到的各种问题。持续更新，有问题评论区一起探讨，写得有不足之处见谅。 Oracle_to_hive 1. main ERROR Could not register mbeans java.security.AccessControlException: access denied ("javax.management.MBeanTr…...
Git 创建新的分支但清空提交记录
有时候需要创建新的分支，但是原有分支的提交非常多，不好区分哪些是创建分支之后的提交。 那么就把原分支的提交全部去掉 要从 分支1 创建 分支2，并确保 分支2 不包含任何提交历史，同时文件与 分支1 的最后一次提交一致࿰…...
SQL PRIMARY KEY
SQL PRIMARY KEY 概述 在关系型数据库中，主键（PRIMARY KEY）是一个非常重要的概念。它是表中每一行数据的唯一标识符，用于保证数据的完整性和准确性。本文将详细介绍SQL中的主键，包括其定义、作用、如何创建和修改主键…...
软件测试学习笔记丨Flask操作数据库-对象与数据模型
本文转自测试人社区，原文链接：https://ceshiren.com/t/topic/23440 对象与数据模型 数据模型：是数据特征的抽象，抽象层次上描述了系统的静态特征、动态行为和约束条件，为数据库系统的信息表示与操作提供一个抽象的框架…...
IntelliJ IDEA使用 MybatisX-Generator 插件 自动生成Entity+Mapper+Mapper.xml等代码
一、Intellij安装MybatisX插件： 首先点击 Intellij->Preference->Plugins，然后搜索MybatisX，点击安装： 2 打开数据库 在IntelliJ IDEA 连接Mysql数据库，选择表，点击右键，选择 Mybatis…...
vue中如何为不同功能设置不同的默认打印设置（设置不同的打印机）
浏览器自带的window.print 功能较简单，这里使用LODOP露肚皮打印 以下是vue2示例： 从官网中下载Lodop和C-Lodop官网主站安装包并安装到本地电脑可以全局搜索电脑找到安装文件LodopFuncs.js，也可以直接复制我贴出来的文件 //用双端口加载主JS…...
经纬恒润INTEWORK-VBA新版本正式发布
在汽车电子研发领域，随着开发测试的深入，工程师们常常面临着一个共同的问题：如何高效地在多样化的开发测试场景中切换，并确保不同工具间的紧密协作。不同场景、不同工具的切换与使用给工程师带来高昂的学习成本和前后端信息传递的…...
金蝶云数据集成至MySQL的高效解决方案
金蝶云数据集成至MySQL的高效解决方案 金蝶云星空数据集成到MySQL的技术案例分享 在企业信息化过程中，数据的高效集成和管理是关键环节。本文将聚焦于一个具体的系统对接集成案例：金蝶云星空的数据如何通过轻易云数据集成平台无缝对接到MySQL数据库。本…...
Day02 C++ 环境设置
2024.11.1 C 环境设置 如果您想要设置 C 语言环境，需要确保电脑上有以下两款可用的软件，文本编辑器和 C 编译器。 一、文本编辑器 通过编辑器创建的文件通常称为源文件，源文件包含程序源代码。 C 程序的源文件通常使用扩展名 .cpp、.cp 或…...
AQS是什么
AQS：AbstructQueuedSynchronizer是java.util.concurrent.locks包中的一个类，是多线程同步器，J.U.C包中的多个组件的底层实现都使用到了它。如：Lock、CountDownLatch、Semaphore. 从本质上来说AQS实现了两种机制的锁，排…...
Spring IOC容器简介
Spring IoC（Inversion of Control，控制反转）容器是Spring框架的核心组件之一，负责管理应用程序中的对象及其依赖关系。IoC容器通过依赖注入（Dependency Injection，DI）实现对象的创建、配置和管理…...
【backstopjs】入门安装环境
1.首先全局安装BackstopJS npm install -g backstopjs 安装失败,常见报错&解决办法： 报错： (venv) D:\workspace\Otaku\backstop>npm install -g backstopjs npm warn deprecated inflight1.0.6: This module is not supported, and leaks mem…...
)
LocalDate 类常用方法详解(日期时间类)
LocalDate 类常用方法详解 LocalDate 是 Java 8 引入的日期时间API中的一个类，用于表示不含时间和时区的日期（年、月、日）。以下是一些常用的 LocalDate 方法： 创建 LocalDate 实例 now()：获取当前日期 LocalDate t…...
kmp desktop实现excel预览
先将excel转paf https://blog.csdn.net/qq_42761569/article/details/121699594 package utilimport com.aspose.cells.License import com.aspose.cells.PdfSaveOptions import com.aspose.cells.Workbook import com.geolo.desktop.common.utils.LogUtils import java.io.Fi…...
OB_GINS_day3
这里写目录标题 实现当前状态初始化实现预积分的初始化由于此时preintegration_options 是3（也就是考虑odo以及earth rotation）为预积分的容器添加需要积分的IMU积分因子接下来是添加新的IMU到preintegration中 实现当前状态初始化 这个state_curr的主要…...
【Python3】【力扣题】405. 数字转换为十六进制数
【力扣题】题目描述： 题意理解：（不允许使用库函数） 数字等于0，则结果为0， 数字小于0，则补码运算，即最高位（32位）为1，其余全部取反，再加…...
记录一次企业外部通过ssh 连接数据库的事DBeaver
情况大概是这样，公司算法供应商开通了连接某个服务器A的权限，但是数据库x是在另一台服务器B上。 直接通过外部连接数据库是不行的，需要借用服务器A来进行访问x 使用软件：DBeaver, 数据库x类型：oracle 需要的信息&am…...
中聚企服：中聚AI女娲大模型，企业难题迎刃而解！
在这个瞬息万变的商业世界里，企业面临的挑战愈发复杂多样。小到日常文书和规章制度，大到工商财税和知识产权保护，每一个环节都至关重要。为了帮助中小企业在激烈的市场竞争中脱颖而出，中聚企服在官方小程序重磅上线了一款革命性产…...
利用最小二乘法找圆心和半径
#include <iostream> #include <vector> #include <cmath> #include <Eigen/Dense> // 需安装Eigen库用于矩阵运算 // 定义点结构 struct Point { double x, y; Point(double x_, double y_) : x(x_), y(y_) {} }; // 最小二乘法求圆心和半径 …...
。】2022-5-15)
【根据当天日期输出明天的日期(需对闰年做判定)。】2022-5-15
缘由根据当天日期输出明天的日期(需对闰年做判定)。日期类型结构体如下： struct data{ int year; int month; int day;};-编程语言-CSDN问答 struct mdata{ int year; int month; int day; }mdata; int 天数(int year, int month) {switch (month){case 1: case 3:…...
K8S认证|CKS题库+答案| 11. AppArmor
目录 11. AppArmor 免费获取并激活 CKA_v1.31_模拟系统 题目 开始操作： 1）、切换集群 2）、切换节点 3）、切换到 apparmor 的目录 4）、执行 apparmor 策略模块 5）、修改 pod 文件 6）、…...
k8s从入门到放弃之Ingress七层负载
k8s从入门到放弃之Ingress七层负载 在Kubernetes（简称K8s）中，Ingress是一个API对象，它允许你定义如何从集群外部访问集群内部的服务。Ingress可以提供负载均衡、SSL终结和基于名称的虚拟主机等功能。通过Ingress，你可…...
线程同步：确保多线程程序的安全与高效！
全文目录： 开篇语前序前言第一部分：线程同步的概念与问题1.1 线程同步的概念1.2 线程同步的问题1.3 线程同步的解决方案 第二部分：synchronized关键字的使用2.1 使用 synchronized修饰方法2.2 使用 synchronized修饰代码块 第三部分ÿ…...
【android bluetooth 框架分析 04】【bt-framework 层详解 1】【BluetoothProperties介绍】
1. BluetoothProperties介绍 libsysprop/srcs/android/sysprop/BluetoothProperties.sysprop BluetoothProperties.sysprop 是 Android AOSP 中的一种 系统属性定义文件（System Property Definition File），用于声明和管理 Bluetooth 模块相…...
TRS收益互换：跨境资本流动的金融创新工具与系统化解决方案
一、TRS收益互换的本质与业务逻辑 （一）概念解析 TRS（Total Return Swap）收益互换是一种金融衍生工具，指交易双方约定在未来一定期限内，基于特定资产或指数的表现进行现金流交换的协议。其核心特征包括&am…...
中关于正整数输入的校验规则)
Element Plus 表单(el-form)中关于正整数输入的校验规则
目录 1 单个正整数输入1.1 模板1.2 校验规则 2 两个正整数输入（联动）2.1 模板2.2 校验规则2.3 CSS 1 单个正整数输入 1.1 模板 <el-formref"formRef":model"formData":rules"formRules"label-width"150px"…...
MySQL 主从同步异常处理
阅读原文：https://www.xiaozaoshu.top/articles/mysql-m-s-update-pk MySQL 做双主，遇到的这个错误： Could not execute Update_rows event on table ... Error_code: 1032是 MySQL 主从复制时的经典错误之一，通常表示ÿ…...
系统掌握PyTorch：图解张量、Autograd、DataLoader、nn.Module与实战模型
本文较长，建议点赞收藏，以免遗失。更多AI大模型应用开发学习视频及资料，尽在聚客AI学院。 本文通过代码驱动的方式，系统讲解PyTorch核心概念和实战技巧，涵盖张量操作、自动微分、数据加载、模型构建和训练全流程&#…...