浏览器发起桌面通知Notification.requestPermission

九段刀客 2020-01-08 11:22:35 358 收藏
分类专栏： chrome
版权
效果右下角提示

三种状态权限

default
用户还未被询问是否授权，所以通知不会被显示。参看 Getting permission 以了解如何请求显示通知的权限。
granted
表示之前已经询问过用户，并且用户已经授予了显示通知的权限。
denied
用户已经明确的拒绝了显示通知的权限。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button onclick="notifyMe()">Notify me!</button>
<script>
function notifyMe() {
Notification.requestPermission(status=>{
if(status === 'granted'){
let notify = new Notification('ERP系统提示',{
icon:'./img/logo.png',
body:'您有新的待审批'
})

// 桌面消息显示时
notify.onshow = ()=>{
let audio = new Audio('./mp3/test2.mp3');
audio.play();
}

// 点击时桌面消息时触发
notify.onclick = ()=>{
// 跳转到当前通知的tab,如果浏览器最小化，会将浏览器显示出来
window.focus()
}
}
})
}
</script>
</body>
</html>
————————————————
版权声明：本文为CSDN博主「九段刀客」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/weixin_35958891/article/details/103888056