- \n
- Notification<\/a><\/li>\n
- \u4f7f\u7528HTML5 Notification API\u5f00\u542f\u6d4f\u89c8\u5668\u684c\u9762\u63d0\u9192<\/a><\/li>\n<\/ul>\n
HTML5 Notification \u00a0\u53ef\u4ee5\u5728\u5141\u8a31\u901a\u77e5\u7684\u60c5\u6cc1\u4e0b\uff0c\u51fa\u73fe\u63d0\u9192\u7684\u8a0a\u606f\uff0c\u800c\u4e14\u4e0d\u9700\u8981\u76ef\u8457\u7db2\u9801\uff0c\u53ea\u8981\u700f\u89bd\u5668\u53ca\u901a\u77e5\u7684\u9801\u9762\u958b\u555f\u7684\u72c0\u614b\u4e0b\u5373\u53ef\u4f7f\u7528\u3002<\/p>\n
\u4f7f\u7528\u524d\u5fc5\u9808\u4e86\u89e3\u700f\u89bd\u5668\u652f\u63f4\u7a0b\u5ea6\u3002<\/p>\n
--<\/p>\n
\u53d6\u5f97\u7db2\u9801\u901a\u77e5\u6b0a\u9650<\/p>\n
$(function(){\r\n\r\n if(Notification && Notification.permission !== \"granted\"){\r\n Notification.requestPermission(function(status){\r\n if(Notification.permission !== status){\r\n Notification.permission = status;\r\n }\r\n });\r\n }\r\n\r\n});\r\n<\/pre>\n\u9801\u9762\u8d77\u59cb\u6642\u8a62\u554f\u3001\u53d6\u5f97\u901a\u77e5\u6b0a\u9650<\/p>\n
--<\/p>\n
\u986f\u793a\u901a\u77e5<\/p>\n
function notify(){\r\n if (Notification.permission === \"granted\") {\r\n var notification = new Notification(\"Hi there!\");\r\n }\r\n else{\r\n alert('Hi there!');\r\n }\r\n}<\/pre>\n\u5beb\u4e00\u500b\u7576\u9700\u8981\u901a\u77e5\u6642\u547c\u53eb\u7684\u529f\u80fd\uff0c\u4e26\u4e14\u6839\u64da\u662f\u5426\u5141\u8a31\u901a\u77e5\u4f86\u57f7\u884c\u8a0a\u606f\u986f\u793a\u65b9\u5f0f<\/p>\n
--<\/p>\n
\u4ec0\u9ebc\u6642\u5019\u901a\u77e5\uff1f<\/p>\n
\u63a5\u4e0b\u4f86\u53ea\u8981\u6c7a\u5b9a\u4ec0\u9ebc\u6642\u5019\u57f7\u884c\u986f\u793a\u901a\u77e5\u7684\u65b9\u6cd5\u5373\u53ef\u3002\u53ef\u4ee5\u7528 WebSocket \u4f86\u9054\u6210\u5373\u6642\uff0c\u4e5f\u53ef\u4ee5\u7528 setInterval() \u5b9a\u6642\u57f7\u884c\u6aa2\u67e5<\/p>\n
--<\/p>\n
\u5b8c\u6574\u7bc4\u4f8b<\/p>\n
<!-- \u624b\u52d5\u57f7\u884c -->\r\n<button onclick=\"notifyMe()\">Notify me!<\/button>\r\n\r\n<script>\r\n Notification.requestPermission(function(status){\r\n console.log('User Choice', status);\r\n if (status !== 'granted') {\r\n console.log('\u63a8\u64ad\u5141\u8a31\u88ab\u62d2\u7d55\u4e86!');\r\n }\r\n });\r\n\r\n function notifyMe() {\r\n \/\/ Let's check if the browser supports notifications\r\n if (!(\"Notification\" in window)) {\r\n alert(\"This browser does not support desktop notification\");\r\n }\r\n\r\n \/\/ Let's check whether notification permissions have already been granted\r\n else if (Notification.permission === \"granted\") {\r\n \/\/ If it's okay let's create a notification\r\n var notification = new Notification(\"Hi there!\");\r\n }\r\n\r\n \/\/ Otherwise, we need to ask the user for permission\r\n else if (Notification.permission !== \"denied\") {\r\n Notification.requestPermission().then(function (permission) {\r\n \/\/ If the user accepts, let's create a notification\r\n if (permission === \"granted\") {\r\n var notification = new Notification(\"Hi there!\");\r\n }\r\n });\r\n }\r\n }\r\n\r\n \/\/ \u6bcf 2 \u79d2\u57f7\u884c\u4e00\u6b21\r\n setInterval(notifyMe, 2000);\r\n<\/script><\/pre>\n\u901a\u77e5\u7684\u8a0a\u606f\u662f\u51fa\u73fe\u5728\u7cfb\u7d71\u4e0a\uff0c\u4e0d\u662f\u986f\u793a\u5728\u700f\u89bd\u5668\u4e2d<\/p>\n
- \u4f7f\u7528HTML5 Notification API\u5f00\u542f\u6d4f\u89c8\u5668\u684c\u9762\u63d0\u9192<\/a><\/li>\n<\/ul>\n
![\"\"](\"https:\/\/blog.hoyo.idv.tw\/wp-content\/uploads\/2017\/02\/20210708_084256_-300x222.jpg\")
<\/a><\/p>\n