作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在 Chrome 版本 42.0.2311.152m 下进行测试,我想实现在通知点击上打开一个窗口,如下例所示:(来源:https://developer.mozilla.org/en-US/docs/Web/API/WindowClient
)
self.addEventListener('notificationclick', function(event) {
console.log('On notification click: ', event.notification.tag);
event.notification.close();
// This looks to see if the current is already open and
// focuses if it is
event.waitUntil(clients.matchAll({
type: "window"
}).then(function(clientList) {
for (var i = 0; i < clientList.length; i++) {
var client = clientList[i];
if (client.url == '/' && 'focus' in client)
return client.focus();
}
if (clients.openWindow)
return clients.openWindow('/');
}));
});
InvalidAccessError
{code: 15,
message: "Not allowed to open a window.",
name: "InvalidAccessError"}
clients.matchAll({type: "window"})
.then(function (clientList) {
console.log(clientList[0])});
{focused: false,
frameType: "top-level",
url: "https://myurl.no-ip.org/app/index.html",
visibilityState: "hidden" }
clients.matchAll({type: "window"})
.then(function (clientList) {
clientList[0].focus()});
{code: 15,
message: "Not allowed to focus a window.",
name: "InvalidAccessError"}
最佳答案
您的代码对我来说很好,所以我将解释使用 openWindow
的要求/focus
,以及如何避免“不允许 [打开|聚焦] 窗口”错误消息。clients.openWindow()
和 windowClient.focus()
仅在单击通知后才允许(至少在 Chrome 47 中),最多为 一个 在单击处理程序的持续时间内,可以调用这些方法中的一些。此行为在 https://github.com/slightlyoff/ServiceWorker/issues/602 中指定。 .
如果您的 openWindow
/focus
调用被拒绝并显示错误消息
"Not allowed to open a window." for
openWindow
"Not allowed to focus a window." forfocus
openWindow
的要求/
focus
.例如(所有点也适用于
focus
,而不仅仅是
openWindow
)。
openWindow
在未点击通知时调用。 openWindow
在 notificationclick
之后调用处理程序返回,您没有调用 event.waitUntil
promise 。 openWindow
在 promise 传递给 event.waitUntil
后调用已解决。 openWindow
的临时权限已到期。 openWindow
真的很有必要/
focus
最多调用一次,并且在
notificationclick
之前调用处理程序完成。
// serviceworker.js
self.addEventListener('notificationclick', function(event) {
// Close notification.
event.notification.close();
// Example: Open window after 3 seconds.
// (doing so is a terrible user experience by the way, because
// the user is left wondering what happens for 3 seconds.)
var promise = new Promise(function(resolve) {
setTimeout(resolve, 3000);
}).then(function() {
// return the promise returned by openWindow, just in case.
// Opening any origin only works in Chrome 43+.
return clients.openWindow('https://example.com');
});
// Now wait for the promise to keep the permission alive.
event.waitUntil(promise);
});
index.html
<button id="show-notification-btn">Show notification</button>
<script>
navigator.serviceWorker.register('serviceworker.js');
document.getElementById('show-notification-btn').onclick = function() {
Notification.requestPermission(function(result) {
// result = 'allowed' / 'denied' / 'default'
if (result !== 'denied') {
navigator.serviceWorker.ready.then(function(registration) {
// Show notification. If the user clicks on this
// notification, then "notificationclick" is fired.
registration.showNotification('Test');
});
}
});
}
</script>
/
而不是
https://example.com
也适用于 Chrome 42)。
关于google-chrome - clients.openWindow() "Not allowed to open a window."在 serviceWorker Google Chrome 上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30302636/
我是一名优秀的程序员,十分优秀!