Web通知无法在chrome上运行，但在Firefox和Microsoft Edge上可以正常运行

Question

我正在尝试发出Web通知，该通知在Firefox和Microsoft Edge上运行良好。即使在Safari上也能正常工作。但它不想在Chrome上运行。 它没有显示错误。这是我的代码：

    <script>
    window.setInterval(function(){notifyMe();}, 5000);
    function notifyMe() {
      if (!("Notification" in window)) {
        alert("This browser does not support desktop notification");
      } else if (Notification.permission === "granted") {
          var data = []
          data['title'] = "notification's title";
          data['body'] = "notification's body";
          var notification = new Notification(data['title'], {
            'body': data['body']
          });
          notification.onclick = function(event) {
            window.open('https://www.example.com/', '_blank');
          }
      } else if (Notification.permission !== "denied") {
        Notification.requestPermission().then(function (permission) {
          if (permission === "granted") {
            var notification = new Notification("really");
          }
        });
      }
    }
</script>

Answer 1

您的网站是否使用https://进行服务-因为Chrome在不安全的来源（例如http://）上已弃用Notifications API

否则，您的代码在Chrome中可以正常工作

Answer 2

网络通知

  

HTTPS（Chrome默认模式）

本地主机调试

  

HTTP

chrome：// settings / content / notifications

https://pushassist.com/knowledgebase/how-to-enable-web-push-notifications-in-google-chrome-non-ssl-site/

1. 打开chrome://flags/，然后搜索notification

2. 启用通知

  

演示代码

"use strict";

/**
 *
 * @author xgqfrms
 * @license MIT
 * @copyright xgqfrms
 * @created 2019-08-17
 *
 * @description
 * @augments
 * @example
 * @link
 *
 */

let log = console.log;

const webNotificationApp = (debug = false) => {
    try {
        if ("Notification" in window) {
            // let ask = window.Notification.requestPermission();
            let ask = Notification.requestPermission();
            ask.then(
                // Permission
                (permission) => {
                    log(`permission =`, permission);
                    if (permission === "granted") {
                        log(`permission granted`);
                        let msg = new Notification("App Upgrade Info", {
                            body: "a new version app is available, click download: https://app.xgqfrms.xyz/download",
                            icon: "https://cdn.xgqfrms.xyz/logo/icon.png",
                        });
                        msg.addEventListener(`click`, (e) => {
                            let btn = e.target.dataset(`btn-type`);
                            if (btn === "ok") {
                                log(`OK`);
                            } else {
                                log(`Cancel`);
                            }
                            alert(`clicked notification`);
                        });
                    }else {
                        log(`notification permission is denied!`);
                    }
                }
            )
        } else {
            console.warn(`your browser is too old, which not support web notification!`);
        }
    } catch (err) {
        console.error(`error =`, err);
    }
};

document.addEventListener(`DOMContentLoaded`, () => {
    log(`DOMContentLoaded`);
    webNotificationApp();
});

// export default webNotificationApp;

// export {
//     webNotificationApp,
// };