Push notification facility for mobile web app

Question

I have a simple scenario, to receive notification on mobile devices whenever it's generated from Server.

I know this facility is available in native iOS app and Android but I am trying to avoid native path. What I would like that:

1. A mobile web app which can be access by visiting a URL
2. User have ability to create a bookmark on Home screen so that it gets feeling of native app Icon.
3. Getting badges of notification(no of messages in round shape)
4. Able to receive notification even if browser is closed.

I know there is a possibility of server side events/Web Sockets but can a web app emulate push notification features?

Solution 1

You can do this without a hybrid app, native app, or requiring users to install Pushover. It is possible to build a "progressive web app" that can send push notifications even after the page has been closed.

These work today in Chrome for Android (and other browsers seem to be implementing support), but there is no support on iOS.

Check out this demo, and this guide explains how to do it: https://developers.google.com/web/fundamentals/engage-and-retain/push-notifications/

Solution 2

as mentioned in Can a Webbased app have push notification? you might try Pushover: Simple Mobile Notifications for Android and iOS.

Solution 3

Able to receive notification even if browser is closed.

You cannot use WebSockets for this. You must use the more recent Push API. Currently it is supported by all major browsers, except Safari on iOS.

However adding support for the Push API from scratch is a lot of work: I suggest to use a third party service like Pushpad (I am the founder).

Solution 4

I am using this architecture

sockjs + rabbitmq + stomp

References:

1. http://www.rabbitmq.com/blog/2012/05/14/introducing-rabbitmq-web-stomp/
2. http://jmesnil.net/stomp-websocket/doc/

Solution 5

You can use a Plug-in for mobile Push Notification to PhoneGap (mobile web application)

https://github.com/awysocki/C2DM-PhoneGap

Push notification or server push is the latest way to send data from the server to the client. Have you noticed how Gmail receives and displays the new email that arrives in your inbox? You don’t need to refresh the browser or click some refresh button to send request and receive latest data from the server.

View more solutions

Comments

[jfriend00]

Why would you avoid the platform notification schemes? They've done a LOT of work for you and will probably do a better job with battery life than you can do (former head of an engr group that did mobile push email).

[Volatil3]

@jfriend00 thanks for reply. One of the reason is platform incompatibility. One to make for iOS and then for Android,BB etc. Submission to Apple Store and Android etc itself is time taking.

[jfriend00]

I'm not aware of how a pure web app can do all the things in your requirements so I was assuming that you were going to at least have a component that was a native app that had to get submitted to the appropriate store.

[jallen]

Did you ever implement a solution for this? I am looking to do something similar.