html5的Notification就可以很好的解决这些问题。Notification生成的消息是不依附于某个页面，仅仅依附于浏览器，所以无论你在看那个页面，浏览器是否最小化，只有有消息推送都能看到。
Notification桌面通知流程
Notification兼容性：
Notification语法：
let notification = new Notification(title, options)
dir : 文字的方向；它的值可以是 auto（自动）, ltr（从左到右）, or rtl（从右到左）
lang: 指定通知中所使用的语言。这个字符串必须在 BCP 47 language tag 文档中是有效的。
body: 通知中额外显示的字符串
tag: 赋予通知一个ID，以便在必要的时候对通知进行刷新、替换或移除。
icon: 一个图片的URL，将被用于显示通知的图标。
Notification实例
<input type="button" value="开启桌面通知" id="btn">
<script>
~ function() {
var btn = document.getElementById('btn')
btn.onclick = function() {
notifyMe()
}
function notifyMe() {
// 首先检查浏览器是否支持
if(!('Notification' in window)) {
alert('浏览器不支持桌面提醒')
}
//检查是否允许Notification
else if(Notification.permission === 'granted') {
newInfo()
}
//如果没有拒绝Notification，就申请用户允许
else if(Notification.permission !== 'denied') {
//回调模式
Notification.requestPermission(function(permission) {
if(permission === 'granted') {
newInfo()
}
})
// Notification.requestPermission().then(//promise
// newInfo()
// )
}
}
function newInfo(title, options) {
title = title || '新的消息'
options = options || {
body: '默认消息',
icon: ''
}
return new Notification(title, options)
}
}()
</script>
服务热线 19970861797
