[ios] How can a web application send push notifications to iOS devices?

I'm working on a web app. How can I send push notifications to iOS users when there is new content?

This question is related to ios iphone web-applications apple-push-notifications

The answer is


The W3C started in 2010 a working group to implement notifications:
http://www.w3.org/2010/web-notifications/

This Working Group develops APIs that expose those mechanisms to Web Applications—so that Web developers creating, for example, Web-based e-mail clients and instant-messaging clients can more closely integrate their Web application behavior with the notification features of the operating systems of their end users.

Finally the result is like a bad joke as it works only if the specific website is open: http://alxgbsn.co.uk/notify.js/

I think they missed to implement the possibility to add push urls so the browser is able to ask for notifications while its running in the background - and above all - if all tabs have been closed.


ACTUALLY.. This is brand new mind you.. On the newest version of OS X (Mavericks) you CAN send push notifications from a webpage to the desktop. But according to the documentation, NOT iPhones:

Note: This document pertains to OS X only. Notifications for websites do not appear on iOS.

Currently Apple has plans to allow 2 kinds of push notifications: OS X Website Push Notifications and Local Notifications.

The obvious hurdle here is that this will not work on PCs, nor will it allow you to do android push notifications.

Furthermore, you actually can with versions as old as Snow Leapord, send push notifications from a website as long as said website is open and active. The new Mavericks OS will allow push notifications even if the site isnt opened, assuming you have already given permission to said site to send push notifications.

From the mouth of Apple:

In OS X v10.9 and later, you can dispatch OS X Website Push Notifications from your web server directly to OS X users by using the Apple Push Notification service (APNs). Not to be confused with local notifications, push notifications can reach your users regardless of whether your website or their web browser is open…

To integrate push notifications in your website, you first present an interface that allows the user to opt in to receive notifications. If the user consents, Safari contacts your website requesting its credentials in the form of a file called a push package. The push package also contains notification assets used throughout OS X and data used to communicate to a web service you configure. If the push package is valid, you receive a unique identifier for the user on the device known as a device token. The user receives the notification when you send the combination of this device token and your message, or payload, to APNs.

Upon receiving the notification, the user can click on it to open a webpage of your choosing in the user’s default browser.

Note: If you need a refresher on APNs, read the “Apple Push Notification Service” chapter in Local and Push Notification Programming Guide. Although the document is specific to iOS and OS X push notifications, paradigms of the push notification service still apply.


Google Chrome now supports the W3C standard for push notifications.

http://www.w3.org/TR/push-api/


While not yet supported on iOS (as of iOS 10), websites can send push notifications to Firefox and Chrome (Desktop/Android) with the Push API.

The Push API is used in conjunction with the older Web Notifications to display the message. The advantage is that the Push API allow the notification to be delivered even when the user is not surfing your website, because they are built upon Service Workers (scripts that are registered by the browser and can be executed in background at a later time even after your user has left your website).

The process of sending a notification involves the following:

  1. a user visits your website (must be secured over HTTPS): you ask permission to display push notifications and you register a service worker (a script that will be executed when a push notification is received)
  2. if the user has granted permission, you can read the device token (endpoint) which should be sent to the server and stored
  3. now you can send notifications to the user: your server makes an HTTP POST request to the endpoint (which is an URL that contains the device token). The server which receives the request is owned by the browser manufacturer (e.g. Google, Mozilla): the browser is constantly connected to it and can read the incoming notifications.
  4. when the user browser receives a notification executes the service worker, which is responsible for managing the event, retrieving the notification data from the server and displaying the notification to the user

The Push API is currently supported on desktop and Android by Chrome, Firefox and Opera.

You can also send push notifications to Apple / Safari desktop using APNs. The approach is similar, but with many complications (apple developer certificates, push packages, low-level TCP connection to APNs).

If you want to implement the push notifications by yourself start with these tutorials:

If you are looking for a drop in solution I would suggest Pushpad, which is a service I have built.

Update (September 2017): Apple has started developing the service workers for WebKit (status). Since the service workers are a fundamental technology for web push, this is a big step forward.


Check out Xtify Web Push notifications. http://getreactor.xtify.com/ This tool allows you to push content onto a webpage and target visitors as well as trigger messages based on browser DOM events. It's designed specifically with mobile in mind.


You can use pushover if you don't want to create your own native app: https://pushover.net/


No, there is no way for an webapp to receive push notification. What you could do is to wrap your webapp into a native app which has push notifications.


You can use HTML5 Websockets to introduce your own push messages. From Wikipedia:

"For the client side, WebSocket was to be implemented in Firefox 4, Google Chrome 4, Opera 11, and Safari 5, as well as the mobile version of Safari in iOS 4.2. Also the BlackBerry Browser in OS7 supports WebSockets."

To do this, you need your own provider server to push the messages to the clients.
If you want to use APN (Apple Push Notification) or C2DM (Cloud to Device Message), you must have a native application which must be downloaded through the online store.


No, only native iOS applications support push notifications.

UPDATE:
Mac OS X 10.9 & Safari 7 websites can now also send push notifications, but this still does not apply to iOS. Read the Notification Programming Guide for Websites. Also check out WWDC 2013 Session 614.


Pushbullet is a great alternative for this.

However the user needs to have a Pushbullet account and the app installed (iOS, Android) or plugin installed (Chrome, Opera, Firefox and Windows).

You can use the API by creating a Pushbullet app, and connect your application's user to the Pushbullet user using oAuth2.

Using a library would make it much easier, for PHP I could recommend ivkos/Pushbullet-for-PHP.


Examples related to ios

Adding a UISegmentedControl to UITableView Crop image to specified size and picture location Undefined Symbols error when integrating Apptentive iOS SDK via Cocoapods Keep placeholder text in UITextField on input in IOS Accessing AppDelegate from framework? Autoresize View When SubViews are Added Warp \ bend effect on a UIView? Speech input for visually impaired users without the need to tap the screen make UITableViewCell selectable only while editing Xcode 12, building for iOS Simulator, but linking in object file built for iOS, for architecture arm64

Examples related to iphone

Detect if the device is iPhone X Xcode 8 shows error that provisioning profile doesn't include signing certificate Access files in /var/mobile/Containers/Data/Application without jailbreaking iPhone Certificate has either expired or has been revoked Missing Compliance in Status when I add built for internal testing in Test Flight.How to solve? cordova run with ios error .. Error code 65 for command: xcodebuild with args: "Could not find Developer Disk Image" Reason: no suitable image found iPad Multitasking support requires these orientations How to insert new cell into UITableView in Swift

Examples related to web-applications

Spring - No EntityManager with actual transaction available for current thread - cannot reliably process 'persist' call How do I choose the URL for my Spring Boot webapp? Difference between MEAN.js and MEAN.io External VS2013 build error "error MSB4019: The imported project <path> was not found" How to unpackage and repackage a WAR file IntelliJ, can't start simple web application: Unable to ping server at localhost:1099 Using form input to access camera and immediately upload photos using web app Pass user defined environment variable to tomcat ASP.NET: HTTP Error 500.19 – Internal Server Error 0x8007000d Best practices when running Node.js with port 80 (Ubuntu / Linode)

Examples related to apple-push-notifications

How to use Apple's new .p8 certificate for APNs in firebase console This certificate has an invalid issuer Apple Push Services registerForRemoteNotificationTypes: is not supported in iOS 8.0 and later Generate .pem file used to set up Apple Push Notifications Will iOS launch my app into the background if it was force-quit by the user? Detect if the app was launched/opened from a push notification Missing Push Notification Entitlement How to fix "no valid 'aps-environment' entitlement string found for application" in Xcode 4.3? Get device token for push notification iOS application: how to clear notifications?