Question

当浏览器打开时，Gcm推送通知消息正在正确发送到端点：json文件中的通知消息。

serviceWorker.js

    'use strict';
self.addEventListener('install', function(event) {
    self.skipWaiting();
    console.log('Installed', event);
});

    self.addEventListener('activate', function(event) {

    console.log('Activated', event);
});
self.addEventListener('push', function(event) {
    console.log('Started', self);
    self.addEventListener('install', function(event) {
        self.skipWaiting();
    });

    self.addEventListener('activate', function(event) {
        console.log('Activated', event);
    });

    self.addEventListener('push', function(event) {
        var url = "http://localhost/pntest/gmpush1.json?param="+Math.random();
        event.waitUntil(
            fetch(url).then(function(response) {
                if (response.status !== 200) {
                    console.log('Problem. Status Code: ' + response.status);
                    throw new Error();
                }
                // Examine the text in the response
                return response.json().then(function(data) {

                    if (data.error || !data.notification) {
                        console.error('The API returned an error.', data.error);
                        throw new Error();
                    }

                    var promises = [];
                            for(var i=0; data.notification && i < data.notification.length; i++) {
                                promises.push(self.registration.showNotification(data.notification[i].title, {
                                    body: data.notification[i].body,
                                    'renotify': true,
                                    icon: data.notification[i].icon
                                    //tag: notification.tag
                                }));
                            }
                            return Promise.all( promises );
                });
            })
        );
    });

    self.addEventListener('notificationclick', function(event) {
        console.log('Notification click: tag ', event.notification.tag);
        event.notification.close();
        var newurl = event.notification.data.newurl;
        console.log(newurl.updatedurl);
        var url = newurl.updatedurl;
        event.waitUntil(
            clients.matchAll({
                type: 'window'
            })
            .then(function(windowClients) {
                console.log(url);
                for (var i = 0; i < windowClients.length; i++) {
                    var client = windowClients[i];
                    if (client.url === url && 'focus' in client) {
                        return client.focus();
                    }
                }
                if (clients.openWindow) {
                    return clients.openWindow(url);
                }
            })
        );

    });
});

gcmpush1.json

{"notification": [{"body": "Test data", "url": "https://www.google.com/", "icon": "http://www.wired.com/wp-content/uploads/2015/09/google-logo-1200x630.jpg", "title": "Test Notification"}]}

当浏览器打开时，它会显示原始消息

测试通知

如果客户端浏览器在我的curl触发器处于脱机状态（未打开）。当重新打开客户端浏览器时，我想要获得原始消息，但我得到的是

网站已在后台更新

在我的卷曲电话中，我使用了＃time; time_to_live＆＃39; = 2419200。

Answer 1

每当通知无法加载数据以显示在Chrome通知窗口上并且＆＃39; PUSH＆＃39;事件生成成功。它将显示＆＃34;网站已在后台更新＆＃34;。（与Curl的通知交付无关。可能没问题）

来自服务工作者代码的一些观察结果：

1）。您正在使用localhost路径来获取数据，在localhost将脱机时会产生加载通知数据的问题。

 var url = "http://localhost/pntest/gmpush1.json?param="+Math.random();

2）。你正在使用两个＆＃39; PUSH＆＃39; SW中的事件代码。可以将工作包装在一个函数中。

self.addEventListener('push', function(event) {...

您可以参考以下URL来创建简单的服务工作者，以获取推送通知的动态数据。

https://developers.google.com/web/updates/2015/03/push-notifications-on-the-open-web?hl=en

gcm推送通知：未显示实际消息重新打开浏览器

1 个答案: