Blog We love to talk!

Jan Tue

Using Web Notifications API Cross Browser

  •  1-26-2016

The Web Notifications API allows a website to notify users of some event even if the website in question is currently not in the foreground. But, you might have guessed it, this API is not yet implemented in all major browsers as we can see on CanIUse.

Using the basic Notifications API is rather simple and can be done with a few lines of JavaScript.

Notification.requestPermission(function() {
    var notification = new Notification('My Notification', { body : 'You have a new notification' });
});

First you need to request the users permission to show notifications. After that creating a new Notifications object is all it takes to display a notification.

This code will work out of the box in Chrome, Opera, Firefox and Safari.

Unfortunately neither Internet Explorer nor Microsoft Edge support the notifications API at this point. You can work around this by using a polyfill like notification.js but this will not give you the full features the real API does.

Image by Johan Larsson

No Comments

Leave a Reply

Your email address will not be published.