来自服务人员单击和图标的 FCM 消息 Chrome 推送通知不起作用

Posted 2023-02-24

【中文标题】来自服务人员单击和图标的 FCM 消息 Chrome 推送通知不起作用

【英文标题】：FCM Messaging Chrome push notifications from service worker click and icon won't work

【发布时间】：2017-01-18 13:10:48

【问题描述】：

这段代码显示我的通知，一切都很好，但在通知弹出窗口中我看不到任何图标，单击通知只是关闭它而不是打开窗口。我从这里得到的这段代码 (Google's tutorial)。

importScripts('https://www.gstatic.com/firebasejs/3.5.2/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/3.5.2/firebase-messaging.js');

firebase.initializeApp(
    'messagingSenderId': 'my id'
);

const messaging = firebase.messaging();

messaging.setBackgroundMessageHandler(function(payload) 
    var title = '';
    var body = '';

    if(payload && payload.notification) 
        if(payload.notification.body) 
            body = payload.notification.body;

            if(payload.notification.title) 
                title = payload.notification.title;
            
        
    

    return self.registration.showNotification(title, 
        body: body,
        icon: '/img/logos/logo-short-blue.png'
    );
);

self.addEventListener('notificationclick', function(event) 
    event.notification.close();

    var appUrl = '/' + event.notification.data.actionUrl;

    event.waitUntil(clients.matchAll(
            includeUncontrolled: true,
            type: 'window'
        ).then( activeClients => 
            if (activeClients.length > 0) 
                activeClients[0].navigate(appUrl);
                activeClients[0].focus();
             else 
                clients.openWindow(appUrl);
            
        )
    );
);

【参考方案1】：

您必须在服务器端使用click_action 作为url 和icon 字段，同时形成推送消息的有效负载。

【参考方案2】：

来自谷歌的指南：

点击操作仅支持安全的 HTTPS URL。