I have found the following example for HTML notifications and it worked fine in Chrome and Firefox. After downloading it and trying it locally it does not work in Chrome anymore. Is this expected behaviour (Chrome preventing notifications locally for some reason) or is there any other reason why this is not working?
<!DOCTYPE html>
<html>
<body>
<button onclick="notifyMe()">Notify me!</button>
<script>
function notifyMe() {
// Let's check if the browser supports notifications
if (!("Notification" in window)) {
alert("This browser does not support desktop notification");
}
// Let's check if the user is okay to get some notification
else if (Notification.permission === "granted") {
// If it's okay let's create a notification
var notification = new Notification("Hi there!");
}
// Otherwise, we need to ask the user for permission
// Note, Chrome does not implement the permission static property
// So we have to check for NOT 'denied' instead of 'default'
else if (Notification.permission !== 'denied') {
Notification.requestPermission(function (permission) {
// Whatever the user answers, we make sure we store the information
if(!('permission' in Notification)) {
Notification.permission = permission;
}
// If the user is okay, let's create a notification
if (permission === "granted") {
var notification = new Notification("Hi there!");
}
});
}
}
</script>
</body>
</html>
According to the W3C Specification what you have looks ok as long as the file is hosted somewhere. Here is a nice notification repo, with live demo.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With