类似于这种新订单通知

window.Notification是html的特性

<button onclick="notifyMe()">Notify me!</button>

function notifyMe() { // 先检查浏览器是否支持 if (!("Notification" in window)) { alert("This browser does not support desktop notification"); } // 检查用户是否同意接受通知 else if (Notification.permission === "granted") { // If it's okay let's create a notification var notification = new Notification("Hi there!"); } // 否则我们需要向用户获取权限 else if (Notification.permission !== 'denied') { Notification.requestPermission(function (permission) { // 如果用户同意，就可以向他们发送通知 if (permission === "granted") { var notification = new Notification("Hi there!"); } }); } // 最后，如果执行到这里，说明用户已经拒绝对相关通知进行授权 // 出于尊重，我们不应该再打扰他们了 }

1.otification.requestPermission(callback);--用于取得用户同意的回调函数  

2.Notification.permission --用户是否同意显示通知。取值：denied (用户拒绝了通知的显示), granted (用户允许了通知的显示), 或 default (因为不知道用户的选择，所以浏览器的行为与 denied 时相同).

3.构造方法 ：let notification = new Notification(title, options)

参数：（1）title一定会被显示的通知标题

　　（2）options 可选一个被允许用来设置通知的对象。它包含以下属性：

• dir : 文字的方向；它的值可以是 auto（自动）, ltr（从左到右）, or rtl（从右到左）
• lang: 指定通知中所使用的语言。这个字符串必须在 BCP 47 language tag 文档中是有效的。
• body: 通知中额外显示的字符串
• tag: 赋予通知一个ID，以便在必要的时候对通知进行刷新、替换或移除。
• icon: 一个图片的URL，将被用于显示通知的图标。

  事件处理

  Notification.onclick

  处理  click 事件的处理。每当用户点击通知时被触发。

  Notification.onshow

  处理  show 事件的处理。当通知显示的时候被触发。

  Notification.onerror

  处理  error 事件的处理。每当通知遇到错误时被触发。

  Notification.onclose

  处理  close 事件的处理。当用户关闭通知时被触发

  兼容谷歌和火狐  ：window.mozNotification || window.webkitNotification

  具体参考：https://developer.mozilla.org/zh-CN/docs/Web/API/notification