前端实现 谷歌浏览器 右下方通知消息

谷歌浏览器自带的通知提醒

1，需要在页面载入时，向用户索取 通知权限；Notification.requestPermission()；
2，然后 新建Notification 就可以实现了；
代码如下：

Notification.requestPermission()；
var notification = new Notification('检测工单', {
    body: '您有新的检测工单待审核哦',
    icon: 'http://assets.souche.com/shop/assets/sso/favicon.ico'// "图标路径，若不指定默认为favicon"
});

控制台测试：
自己在浏览器可以尝试一下
首先赋权：

然后 新建Notification对象就可以了

通知显示 如图所示：
对于控制台的提示，是说谷歌的这个通知功能 需要在https的协议下才行；但是有一个例外localhost，算是开后门吧；

使用说明
这段代码可以放在获取数据之后；
比如：我的这次需求，是希望跟后台建立websocket连接，当接收到后端返回的消息时，弹出通知；

扩展
谷歌的这个通知提醒还有其他的很多属性，可以设置其他参数，比如打开链接，跳转链接等等；有兴趣的同学，可以自己尝试下；