需要实时桌面推送的功能，就像平时QQ，微信消息推送那种，这个时候我们就可以用到HTML5 Web Notification 这个API了。
Notification 弹出一个通知在桌面右下角：
if(!("Notification" in window)) {
//alert("This browser does not support desktop notification");
}
if(Notification.permission !== 'denied') { //判断是否授权,没授权先授权在通知
Notification.requestPermission(function(permission) {
// 如果用户同意，就可以向他们发送通知
if(permission === "granted") {
var notice_ = new Notification('通知', {
body: '你有一条信息'
});
notice_.onclick = function() { //单击消息提示框，进入浏览器页面
window.focus();
}
}
});
}
if(Notification.permission === 'denied') { //已授权直接通知
Notification.requestPermission(function(permission) {
// 如果用户同意，就可以向他们发送通知
if(permission === "granted") {
var notice_ = new Notification('通知', {
body: '你有一条信息'
});
notice_.onclick = function() { //单击消息提示框，进入浏览器页面
window.focus();
}
}
});
}备注：
1. 谷歌浏览器需要是https的网址,不然会提示不安全, 不能修改通知权限,无法实现弹框。
2.如果这段代码放在html中执行，一定要创建虚拟服务器，即用域名访问，如：localhost，不能直接用file:index.html 这样的路径访问，因为这个不是http协议，浏览器不接受本地文件的通知设置。
3.如果之前没有为该域名请求权限，则不会有弹窗。选择【允许】，则可以进行桌面推送。
Notification使用说明：
Notification.permission这是一个静态属性，有3个值，default, granted, denied
default表示还没有发出过请求，或者之前请求过，但是用户并没有允许或者禁止，二是直接关闭窗口。这种状态下是不会有通知的。
granted表示之前向用户请求过权限，而且用户已经允许了。
denied表示之前向用户请求过权限，但是用户已经拒绝了。
new Notification(title, options)，其中title是必须参数，表示推送消息框的标题内容，options是可选参数，下面是一些参数的简单说明(一些常用的，其他的有兴趣的可以自己去了解)
lang：提示的语言
bady：提示消息的主体内容
tag：标记当前通知的标签 icon：左边的显示头像或者图标
renotify：是否替换之前的通知项
事件句柄
Notification.onclick 处理 click 事件的处理。每当用户点击通知时被触发。
Notification.onshow 处理 show 事件的处理。当通知显示的时候被触发。
Notification.onerror 处理 error 事件的处理。每当通知遇到错误时被触发。
Notification.onclose 处理 close 事件的处理。当用户关闭通知时被触发。
兼容性
最后就是该API的兼容性啦，IE就直接被抛弃了 。只能在pc端非ie使用，但是目前市场上IE的使用率也越来越低了。
本文内容仅供个人学习、研究或参考使用，不构成任何形式的决策建议、专业指导或法律依据。未经授权，禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载，请保留原文来源信息，不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持！