摘要：一些情况下，我们希望网页可以直接向桌面推送消息。查看一个简单的例子请求权限弹出一个通知两秒后关闭通知首先，我们需要判断浏览器是否支持。如果通过向用户请求权限，这是浏览器会弹出一个是否允许显示通知的提示如果用户选择了允许，那么返回的将会是。
一些情况下，我们希望网页可以直接向桌面推送消息。本文利用 HTML5 的 Web Notifications API 来展示具体的代码该如何编写，同时来看一看这个特性在各个浏览器上的兼容性如何。
查看DEMO
一个简单的例子javascript if(window.Notification && Notification.permission !== "denied") {
Notification.requestPermission(function(status) { // 请求权限
if(status === "granted") {
// 弹出一个通知
var n = new Notification("Title", {
body : "I am a Notification",
icon : "./images/test1.png"
});
// 两秒后关闭通知
setTimeout(function() {
n.close();
}, 2000);
}
});
}
首先，我们需要判断浏览器是否支持Notification。如果通过Notification.requestPermission向用户请求权限，这是浏览器会弹出一个是否允许显示通知的提示：
如果用户选择了“允许”，那么返回的status将会是granted。这个时候我们就可以通过Notification()来创建实例了：
new Notification("Title", {
body : "I am a Notification",
icon : "./images/test1.png"
})
第一个参数为标题，第二个参数为配置参数，里面包含以下可选参数：
效果图如下（Chrome）：
接下来，两秒后，通知将会消失。
兼容性Web Notifications API目前在以下浏览器得到了支持：
Firefox 35+
Chrome 31+
Safari 7.1+
Opera 27+
Android Browser 4.4+ （需要加上webkit前缀）
详情点击这里
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/85547.html
摘要：据猜测是为浏览器翻译服务。通知内容，显示在通知标题之下，默认为空字符串标记通知的类型，打上标签，默认为空字符串。在最新的技术评审稿中，该参数被舍弃设置该标志表示最终用户将不能很容易地清除。设置该标志，通知将为永久型通知。 Web Notification 网页通知API。这是2011年由谷歌技术员John Gregg提出的一项网页通知api。 定义 请读者直接参考whatwg工作组对...
摘要：返回值有三种情况用户还未被询问是否授权，所以通知不会被显示。用户已经明确的拒绝了显示通知的权限。非必须，默认为表示要显示指定通知是否应该粘滞性，即不容易被用户清理。 本文发布在我的博客H5的Notification特性 - Web的桌面通知功能许可协议: 署名-非商业性使用-禁止演绎 4.0 国际 转载请保留原文链接及作者。 目前，web网页使用桌面通知功能的越来越多，包括微博...
阅读 2672·2023-04-25 17:21
阅读 2518·2021-11-23 09:51
阅读 2790·2021-09-24 10:32
阅读 3693·2021-09-23 11:33
阅读 1947·2019-08-30 15:44
阅读 3436·2019-08-30 11:18
阅读 3419·2019-08-30 10:53
阅读 604·2019-08-26 13:25
