有的时候我们会在桌面右下角看到这样的提示：
这种桌面提示是HTML5新增的 Web Push Notifications 技术。
Web Notifications 技术使页面可以发出通知，通知将被显示在页面之外的系统层面上。能够为用户提供更好的体验，即使用户忙于其他工作时也可以收到来自页面的消息通知，例如一个新邮件的提醒，或者一个在线聊天室收到的消息提醒等等。
PS：除了IE外，各大现代浏览器都对这个桌面推送有了基本的支持。
开始
要创建一个消息通知，非常简单，直接使用 window 对象下面的 Notification 类即可，代码如下：
var n = new Notification("桌面推送", {
icon: 'img/icon.png',
body: '这是我的第一条桌面通知。',
image:'img/1.jpg'
});于是你就会看到系统桌面弹出我上面那张截图的通知。
PS：消息通知只有通过 Web服务访问 该页面时才会生效，如果直接双击打开本地文件，是没有任何效果的。也就是说你的文件需要使用服务器的形式打开，而不是直接使用浏览器打开本地文件。
当然也有可能你什么都没看到，别着急继续往下看。
基本语法
当然在想要弹出上面通知之前，有必要了解一下一个通知的基本语法：
let myNotification = new Notification(title, options);
title ：定义一个通知的标题，当它被触发时，它将显示在通知窗口的顶部。
options （可选）对象包含应用于通知的任何自定义设置选项。
常用的选项有：
body: 通知的正文，将显示在标题下方。
tag: 类似每个通知的ID，以便在必要的时候对通知进行刷新、替换或移除。
icon: 显示通知的图标
image: 在通知正文中显示的图像的URL。
data: 您想要与通知相关联的任意数据。这可以是任何数据类型。
renotify: 一个 Boolean 指定在新通知替换旧通知后是否应通知用户。默认值为false，这意味着它们不会被通知。
requireInteraction: 表示通知应保持有效，直到用户点击或关闭它，而不是自动关闭。默认值为false。
当这段代码执行时，浏览器会询问用户，是否允许该站点显示消息通知，如下图所示：
只有用户点击了 允许 ，授权了通知，通知才会被显示出来。
授权
如何获取到用户点击的是“允许”还是“阻止”呢？
window的 Notification实例有一个 requestPermission 函数用来获取用户的授权状态：
