Question

我正在使用firebase messaging的网站上工作，为此firebase的自定义服务工作者已在网站上注册。

网站有点网络聊天，可以在firebase database中同步和存储消息，网站使用angular-ui-router从网址获取消息密钥，网站会在收到新消息时显示通知如果点击了通知，则从客户端和URL修改相关消息，但是当网站没有聚焦时，这对服务工作者来说很困难，因为服务工作者抛出错误unable to navigate < / p>

服务工作者代码是这样的：

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

firebase.initializeApp({
    "messagingSenderId": "######"
});

const messaging = firebase.messaging();

messaging.setBackgroundMessageHandler(function(payload){
    var title = payload.data.title;
    var options = {
        body: payload.data.message,
        icon: "apple-touch-icon.png",
        data: {
            postId: payload.data.postKey
        }
    };

    return self.registration.showNotification(title, options);
});

self.addEventListener("notificationclick", function(evt){
    var postKey   = evt.notification.data.postId;
    var origin    = evt.target.origin;
    var urlTarget = origin + "/#!/" + postKey;

    evt.notification.close();

    evt.waitUntil(
        self.clients.matchAll({
            includeUncontrolled: true,
            type: "window"
        })
        .then(function(clientList) {  
            if(clientList.length > 0){
                var client = clientList[0];

                client.navigate(urlTarget);

                if(client.focus){
                    return client.focus();
                }
            }

            if(self.clients.windowOpen){
                return self.clients.windowOpen(urlTarget);
            }
        }));
});

我期待的行为如下：

焦点

：

收到消息
显示通知
点击通知时修改网址。

通知前点击：https://example.com/#!/

通知后点击：https://example.com/#!/-key

非焦点

：

推送
修改数据以显示通知
显示通知
关注/打开网站点击通知
焦点/打开时修改网址

焦点/开放时：https://example.com/#!/-key

显示焦点通知的代码工作正常，所以我不认为发布代码是必要的。

对此的任何帮助表示赞赏，我已经在字面上花了所有我想到的替代选项

Answer 1

作为per the specification（参见4.2.10，步骤4），WindowClient.navigate()可能拒绝的原因之一是客户端的活动服务工作者与当前服务工作者不同执行代码。换句话说，如果窗口不受当前服务工作者控制，则该服务工作者无法告诉它导航到给定的URL。

我建议您使用

self.clients.matchAll({
  includeUncontrolled: false,
  type: 'window'
})

确保您只返回当前服务工作者控制的WindowClient个实例。

JS Firebase：服务工作者无法解决

1 个答案: