当用户单击后端生成的通知时,我实际上打开了一个新窗口,这在浏览器上运行良好,因为它会在浏览器打开时打开一个新选项卡,否则打开一个新窗口。
但是如果我安装了 PWA,在收到通知时单击它会打开一个新的浏览器窗口,但不会打开 PWA。
这是我的 notificationclick 事件代码:
如果 PWA 打开,我调用 focus(),然后调用 navigate(url),但如果 PWA 关闭,我无法打开 PWA,然后调用 focus 和 navigate 函数。
event.waitUntil(clients.matchAll({
type: "window"
}).then(function (clientList) {
console.log('clientList: ', clientList);
if (data.WebUrl) {
for (var i = 0; i < clientList.length; i++) {
var client = clientList[i];
console.log('client: ', JSON.stringify(client), client);
if ('focus' in client) {
client.focus();
// try to navigate to the url in the focused client
client.navigate(data.WebUrl).then((response) => {
event.notification.close();
});
break;
}
else {
clients.openWindow(data.WebUrl);
event.notification.close();
}
}
}
}));
是否有办法以编程方式打开 PWA?
最佳答案
我终于能够通过以下方式实现我想要的:
event.waitUntil(clients.matchAll({
type: "window",
includeUncontrolled: true
}).then(function (clientList) {
if (data.WebUrl) {
let client = null;
for (let i = 0; i < clientList.length; i++) {
let item = clientList[i];
if (item.url) {
client = item;
break;
}
}
if (client && 'navigate' in client) {
client.focus();
event.notification.close();
return client.navigate(data.WebUrl);
}
else {
event.notification.close();
// if client doesn't have navigate function, try to open a new browser window
return clients.openWindow(data.WebUrl);
}
}
}));
https://stackoverflow.com/questions/58922625/
相关文章:
amazon-web-services - 状态机忽略阶跃函数错误
typescript - 如何使用 TestCafe 在失败时截屏
android-studio - 为什么我只看到官方 android 类的反编译源代码?
react-native - 从选项卡导航选项卡打开抽屉导航
azure - 从 Azure 部署中排除 Azure Function 中的文件
tensorflow - 如何将学习从 tensorflow 1.14 转移到 tf 2?
python - 鼠兔连接丢失 Error : pika. exceptions.StreamLos