使用前景/焦点中的页面创建Firebase通知 [英] Create Firebase notification with page in foreground/focus

问题描述

使用Firebase云消息传递（适用于网络），如何生成网页关闭时或后台显示的通知，但是当我实际关注网页时？

With Firebase Cloud Messaging (for web), how can I generate the notification that appears when the webpage is closed or in the background, but when I'm actually focused on the webpage?

据我所知， messaging.onMessage（...）是我在页面处理传入消息的地方焦点，但我似乎无法找到有关如何仍然创建通知弹出窗口的文档，就好像页面在后台。

It's my understanding that messaging.onMessage(...) is where I handle incoming messages when the page is in focus, but I can't seem to find documentation on how I could still create the notification pop-ups as though the page were in the background.

感谢您的时间！

推荐答案

通过通知处理传入的消息API

handle incoming messges by Notification API

messaging.onMessage(function(payload) {
    const notificationTitle = payload.notification.title;
    const notificationOptions = {
        body: payload.notification.body,
        icon: payload.notification.icon,        
    };

    if (!("Notification" in window)) {
        console.log("This browser does not support system notifications");
    }
    // Let's check whether notification permissions have already been granted
    else if (Notification.permission === "granted") {
        // If it's okay let's create a notification
        var notification = new Notification(notificationTitle,notificationOptions);
        notification.onclick = function(event) {
            event.preventDefault(); // prevent the browser from focusing the Notification's tab
            window.open(payload.notification.click_action , '_blank');
            notification.close();
        }
    }
});

这篇关于使用前景/焦点中的页面创建Firebase通知的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！