This repository has been archived by the owner on Feb 27, 2023. It is now read-only.
Click on notifications opens login page #1
Comments
|
POC from https://web-push-book.gauntface.com/chapter-05/02-display-a-notification/ service-worker.js const examplePage = '/demos/notification-examples/example-page.html';
function focusWindow(event) {
const urlToOpen = new URL(examplePage, self.location.origin).href;
const promiseChain = clients.matchAll({
type: 'window',
includeUncontrolled: true
})
.then((windowClients) => {
let matchingClient = null;
for (let i = 0; i < windowClients.length; i++) {
const windowClient = windowClients[i];
if (windowClient.url === urlToOpen) {
matchingClient = windowClient;
break;
}
}
if (matchingClient) {
return matchingClient.focus();
} else {
return clients.openWindow(urlToOpen);
}
});
event.waitUntil(promiseChain);
}
self.addEventListener('notificationclick', function(event) {
event.notification.close();
focusWindow(event);
});
self.addEventListener('notificationclose', function(event) {
const dismissedNotification = event.notification;
event.waitUntil(Promise.resolve());
});index.html <!DOCTYPE html>
<html>
<body>
<button onclick="mybutton()">Focus a Window OR Open</button>
<script type="text/javascript">
function registerServiceWorker() {
return navigator.serviceWorker.register('service-worker.js')
.then(function(registration) {
console.log('Service worker successfully registered.');
return registration;
})
.catch(function(err) {
console.error('Unable to register service worker.', err);
});
}
window.addEventListener('load', function() {
return registerServiceWorker()
.then(function(registration) {
window.registration = registration
navigator.serviceWorker.addEventListener('message', function(event) {
console.log('Received a message from service worker: ', event.data);
});
})
})
function mybutton(){
const options = {
body: 'Clicking on this notification will focus on an open window ' +
'otherwise open a new one.',
tag: 'focus-window'
};
registration.showNotification('Focus or Open a Window', options);
};
</script>
</body>
</html> |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
We want the page to be reloaded. But then when clicking the notification, the browser can not find the tab (because it was replaced) and will open a new one at /.
Options:
The text was updated successfully, but these errors were encountered: