Safari Push Notifications

As a web developer working on a Mac, one of the more intriguing additions to OS X Mavericks was Safari Push Notifications. Though local notifications have been around for a while, those only worked as long as the site visitor had a browser window open on that page. Push notifications held a lot more potential: the user didn't have to stay on the webpage. They didn't even have to have their browser open.

Using our website a testbed, we decided to implement this new functionality on our blog. We wanted blog authors to receive notifications on their OS X desktop when anyone left a comment on any article they wrote. This took a little more wrestling than we anticipated… though Apple provided documentation about Safari Push Notifications, it extremely frustrating to follow because it skips some steps around certificates. I'll save you the headache of digging around, and point you to the documentation you'd need that covers the creation of .P12 and .PEM certificate files.

The end result is some pretty streamlined interaction. And unlike local notifications, the elements are branded by our website, not by the browser. Neat! The process starts in Safari, with some javascript asking the user for permission to send notifications:

Since this is a javascript trigger, we've already seen websites pop up this alert when the page loads. I don't know about you, but having an alert spawn on page load is the worst way to get me to interact with your site! Thanks to years of aggressive online advertising, we've been trained to immediately dislike and distrust these kinds of attention-grabbing methods. For the Visual Lizard blog, we tucked this trigger over on the administrative side of our Catalyst content management system instead; only when the user presses a clearly labelled button do we trigger the alert.

Now, once permission has been granted, all future interaction is handled through web servers and Apple's services. How and when notifications are sent are handled by web developers and their code. For example, a visitor can leave a comment on this blog and that'll trigger PHP on the server, sending a notification through Apple's push notification services to the blog article's author. Whether we're at our computer or not, whether we're working in any app or not, we'll receive an OS X notification that looks like this:

Handy! And how these notifications display on your desktop are managed just like any other notifications, through the OS X preference pane:

However, there are some downsides. These notifications seem to be device specific. If you sign up to receive notifications on your computer, you won't receive them on your iOS devices. It's set to your OS X desktop, not to your Apple ID. And you'll need to use Safari 7.0+ to grant and deny permissions from then on. You don't have to trust the website developers to enforce any "do not spam me anymore" functionality (thankfully) as you can handle that through Safari's preferences… but that ties these alerts Apple's browser.

The end result? Some pretty cool functionality… but web developers like myself won't find may opportunities to use it. In our testing, it does provide feedback from our site much faster than email (which is limited by when cron jobs run and how often our mail apps fetch information). It would be very useful for any Catalyst administrators looking for near-instantaneous updates on online purchases, registrations, or similar items from their site that require manual review. But because it's tied to OS X Mavericks and Safari 7.0+ specifically, it narrows the number of people that would be able to use it.

to blog