Send desktop notifications in Chrome or Firefox from a closed web app?

Google ChromeFirefoxNotificationsPush NotificationWeb Notifications

Google Chrome Problem Overview


My goal is to send Gmail-style desktop notifications in Chrome or Firefox from a web app (let's call it X) that is NOT currently open in the browser, without requiring the user to install an app or extension. It's okay if the user needs to grant permission to receive notifications from X, and it's okay if the browser needs to be open for the notification to appear, as long as X doesn't need to be open in the browser. A solution that doesn't require any browser window to be open would also work.

I just spent the day digging into this, and so far I think I've learned:

  • Since OSX Mavericks, it has been possible to do this in Safari 7+ via Safari Push Notifications.
  • The Web Notifications API works in Chrome/Firefox, but requires the user's browser to be open to X.
  • Twitter sends similar web notifications without asking the user for permission first, but requires the user's browser to be open to Twitter.
  • There are lots of references to possible Growl implementations, but as far as I can tell, all of them require the user to install Growl and/or a Growl-enabled app to work.

I could be wrong about any of my statements above - I'd love to hear it! - and I'm open to any other solution too. Any ideas?

Thanks for reading.

Google Chrome Solutions


Solution 1 - Google Chrome

You can send push notifications even when your web page is not active using Service Workers, the Notification API for service workers and the push API for server-initiated notifications (or scheduled notifications).

As of June 2016, Service Workers are supported in Chrome, Firefox and Opera. See the status at https://jakearchibald.github.io/isserviceworkerready/

See the following links for related discussions, status of implementation and specifications.

Solution 2 - Google Chrome

You can do exactly what you are looking for using the W3C Push API.

If you want to build everything from scratch I suggest to start reading this tutorial by Google. It is for Chrome, but Firefox works in a very similar way.

However it's a lot of work and the "standard" is still evolving: I suggest that you use a service like Pushpad (I am the founder).

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
Questionuser1544138View Question on Stackoverflow
Solution 1 - Google ChromeRob WView Answer on Stackoverflow
Solution 2 - Google ChromecollimarcoView Answer on Stackoverflow