How do Stack Overflow desktop notifications work?

Question

Perhaps this is a fairly big and ambiguous question:

In the Stack Overflow chatrooms, there is a button to "enable desktop notifications," which will show something in the system tray when someone replies to you.

By what mechanism does this work? It's always made me curious.

How does a website access the system tray?

Answer 1

They're called Desktop Notifications, which use the Notifications API.

Basically, the site checks for Notifications API support, then the user grants or denies the website permission to display notifications.

Here is more information on how the API works.

Answer 2

This is with the help of WebSockets - Web APIs. There is actually a persistent connection between the client and the server. And also both parties can start sending data at any time.

Answer 3

It uses the Notification object (i.e. var n = new Notification("Hello");) to provide local notifications on a per-website basis. Each browser implements the standard differently (see Chrome, Firefox, and Safari), but they all operate essentially the same way, sending notifications based on the permissions they have (window.Notification.permission), which can be default (hasn't been asked, in which case you would window.Notification.requestPermission();), granted, or denied. Opera and Internet Explorer do not support desktop notifications at this time.