web notification api
Web Notifications API 使页面可以发出通知,通知将被显示在页面之外的系统层面上(通常使用操作系统的标准通知机制,但是在不同的平台和浏览器上的表现会有差异)
要显示一条通知,你需要先请求适当的权限。Web Notifications API 请求 权限有两种方式
1、Notification.requestPermission(callback)
2、Notification.requestPermission().then(function(status){ ... })
Notification.requestPermission().then(function(status) {
console.log(status) //status有三种状态 default默认(会询问用户是否开启通知的权限) granted已经允许开启通知 denied用户已经明确的拒绝了显示通知的权限。
if(status == 'granted'){
new Notification(title, { //new Notification是发送通知 title是标题 body是通知的内容 icon发送人的图标
body: 'can i addfriend you',
icon: 'http://combustion-engines.oss-cn-shanghai.aliyuncs.com/CombustionEnginesTupian/2017/dfbb2d68-97e4-4b9f-8d5f-82a636e3edcc.png'
})
}
});
详情可以去这里查看MDN web notification api
web notification api的更多相关文章
- HTML5中的Web Notification桌面通知
大家在做一些浏览器端的聊天功能的时候,或者在一些网站跟在线客服咨询的时候,会看到一些消息通知的提示,常见的有浏览器标签页的闪烁和屏幕右侧的消息通知.本篇博客就在这里简单的介绍一下如何实现这样的功能. ...
- RSS & Server-Sent Events & HTML5 Notification API
RSS Rich Site Summary https://en.wikipedia.org/wiki/RSS https://www.lifewire.com/what-is-rss-2483592 ...
- 简单了解HTML5中的Web Notification桌面通知
原文:http://www.zhangxinxu.com/wordpress/2016/07/know-html5-web-notification/ 需要注意的是,消息通知只有通过Web服务访问该页 ...
- 介绍一个比较酷东西:HTML5 桌面通知(Notification API)
Notification API 是 HTML5 新增的桌面通知 API,用于向用户显示通知信息.该通知是脱离浏览器的,即使用户没有停留在当前标签页,甚至最小化了浏览器,该通知信息也一样会置顶显示出来 ...
- HTML5权威指南--Web Storage,本地数据库,本地缓存API,Web Sockets API,Geolocation API(简要学习笔记二)
1.Web Storage HTML5除了Canvas元素之外,还有一个非常重要的功能那就是客户端本地保存数据的Web Storage功能. 以前都是用cookies保存用户名等简单信息. 但是c ...
- 【HTML5】Web Audio API打造超炫的音乐可视化效果
HTML5真是太多炫酷的东西了,其中Web Audio API算一个,琢磨着弄了个音乐可视化的demo,先上效果图: 项目演示:别说话,点我! 源码已经挂到github上了,有兴趣的同学也可以去st ...
- 【完全开源】百度地图Web service API C#.NET版,带地图显示控件、导航控件、POI查找控件
目录 概述 功能 如何使用 参考帮助 概述 源代码主要包含三个项目,BMap.NET.BMap.NET.WindowsForm以及BMap.NET.WinformDemo. BMap.NET 对百度地 ...
- 关于HTML5音频——audio标签和Web Audio API各平台浏览器的支持情况
对比audio标签 和 Web Audio API 各平台浏览器的支持情况: audio element Web Audio API desktop browsers Chrome 14 Yes ...
- Web动画API教程2:AnimationPlayer和Timeline
本文转载: Web动画API教程2:AnimationPlayer和Timeline
随机推荐
- nacos部署注意点
官方Naming Configuration Service https://nacos.io/zh-cn/docs/deployment.html 划重点 单机部署 单机部署默认嵌入式存储数据 支持 ...
- Bash知识点记录
变量的设置规则 1. 等号两边不能直接接空格符. 2. 右侧的变量内容若有空格符,可使用双引号或单引号将变量内容括起来,其中, 双引号内的特殊字符如 $ 等,可以保有原本的特性.如下所示: ...
- 关键时刻,让你的iphone拒绝掉的所有来电
夜间被骚扰电话吵醒是会非常烦躁的,以下就是iphone的勿扰模式,配合刚出的夜间深夜模式非常的nice. 可以自定义设置时间段,每天智能切换. 也可以开启个人收藏的白名单,让家人有紧急事情也可以联系到 ...
- excel如何快速统计出某一分类的最大值?
问题:如何统计出某一分类的最大值? 解答:利用分类汇总或透视表快速搞定! 思路1:利用分类汇总功能 具体操作方法如下: 选中数据区任意一个单元格,然后点击“数据-分类汇总”按钮.(下图 1 处). 在 ...
- css 那些使用小技巧(兼容性)
1. inline-block 的兼容性问题 display:inline-block; *display:inline; *zoom:1; 2. Microsoft Edge 自动给数字加下划线 在 ...
- #Linux 下 Xampp的安装与Hello World
一.下载安装 去官网下载 移动下载完毕的xampp-linux-x64-7.4.6-0-installer.run 到/usr/local/jayce-softwares/xampp目录下(jayce ...
- mongoDB的基本使用方法
MongoDB 安装(乌班图系统) apt install mongodb mongoDB与sql的对比 SQL术语/概念 MongoDB术语/概念 解释/说明 database database 数 ...
- ant+jmeter+jenkins接口自动化测试一
[Jmeter篇]jmeter+Ant+Jenkins接口自动化测试集成(一) 橙子探索测试发表于橙子探索测试订阅 90 一.简介 1.什么是ant? ant是构建工具,把代码从某个地方拿来,编译,再 ...
- Java并发包JUC核心原理解析
CS-LogN思维导图:记录CS基础 面试题 开源地址:https://github.com/FISHers6/CS-LogN JUC 分类 线程管理 线程池相关类 Executor.Executor ...
- 04[掌握] Java连接redis操作
1,Jedis所需要的jar包依赖 <dependency> <groupId>redis.clients</groupId> <artifactId> ...