Web Push notifications on Chrome for Android: Do I need a third party service like GCM or SNS? - google-chrome

I'd like to set up Web Push notifications on my progressive web application (PWA) using Service Workers. But I'm having trouble understanding the role of third-party services like Google Cloud Messaging and Amazon SNS, and if I need them at all.
From what I understand, when the user clicks the Allow notifications button, you get a unique subscription endpoint. Then in your backend, you can use this endpoint to send notifications to that specific user.
However, all back end libraries that I've found (like pywebpush or web-push for Node.js), mention that you need a GCM API key in order to send notifications.
But here is what the MDN Push API documentation says:
Chrome versions earlier than 52 require you to set up a project on
Google Cloud Messaging to send push messages [...]
So I'm assuming that the new versions of Chrome (version 58 today) should be able to display notifications without the help of a third party.
Here is an example of what I want to achieve. I'm just not sure of what they do in the backend.
Note: I'm not trying to send native push notifications to Android or iOS devices, but only to my progressive web application on Chrome using the Web Push API.

The Browser Push Service
As I have explained in another answer, in order to send web push notifications, you need to interact with the browser push service. Basically each browser, when the user allows push notifications, returns an endpoint (URL) that is specific for its own push service.
For example:
Chrome and Opera endpoints start with prefix https://fcm.googleapis.com/, because they use FCM (ex GCM)
Firefox endpoints start with prefix https://updates.push.services.mozilla.com/, because Firefox uses Mozilla autopush
So notifications will always pass through FCM and autopush, there's no alternative: the push service is hardcoded inside the browser.
Web Push Notification Services as a layer of abstraction
There is also another kind of web push services. Their aim is to provide a layer of abstraction and additional features over the browser push service. For example Pushpad is one of them (I am the founder).
Instead of interacting directly with the different browser push services (e.g. FCM, autopush), your web app can interact just with one push service (e.g. Pushpad), which then interacts with the browser push services for you (automating many tasks, like VAPID and providing additional features like monitoring and integrations).
Confusion about FCM
FCM is quite confusing because it acts both as a "browser push service" for Chrome and Opera, but it also acts as a general "web push notification service" for other browsers. So for Firefox for example, FCM acts as a proxy towards Mozilla autopush.

Related

Best way to send push notifications from the server to a chrome extension?

I'm making a chrome extension for a classified ads website. With the chrome extension users will be able to get latest lists from their watched categories/search query.
I am already working on a websocket server to send notifications to users, but this way I have to always have a socket connection open to every user.
My second approach was to use Firebase, but this will run the notification only when a user clicks the icon (as I've read), and I would rather have this done from my server
__
Are there any other possible solutions to send notifications to a chrome extension without the user clicking on the icon?
You can use Google's push infrastructure ― the very same that powers Android push notifications ― Google Cloud Messaging.
Note: Firebase Cloud Messaging is presented as an upgraded version of GCM; while true, it's not natively supported by Chrome in a way that GCM is.
chrome.gcm API is the one that works with it. See its documentation, as well as GCM documentation, for details.
There's even a tutorial: Implementing GCM Client on Chrome
But in a nutshell, your extension will register as a subscriber with GCM, pass the subscription ID to the server, and then the application server posts messages to GCM using those IDs.
You should also be able to use Firebase, if you're willing to implement it using the generic JS SDK; "this will run the notification only when a user clicks the icon" sounds pretty nonsensical ― a background page should be able to keep a listener alive and react, which is probably how your system works now. I would still recommend a native API, which should be compatible with Event pages.
Have you looked at the chrome.notifications API? It allows you to create rich notifications using templates and show these notifications to users in the system tray.
https://developer.chrome.com/apps/notifications
You can have a connection to your socket server in the background script, listen for messages from your socket server and trigger an event that shows the notification.

Is it possible to send push notification to a Chrome Web user using Azure Notification Hub?

I would like to send notifications to the mobile users of my website (especially Android/Chrome users).
I see that Azure Notification Hub handle Google (GCM) technology, and i've red this tutorial: Send push notifications to Chrome apps, but can this be done with a simple Web application, and not a Chrome Application like in this tutorial?
My application is an ASP.NET MVC 4.5, hosted on Azure.
This feature is currently not supported with Azure Notification Hubs. However, this is in the future roadmap for the product.

Can I use GCM for a chrome EXTENSION?

I'm new to web development and currently I'm trying to create a chrome extension.
I followed this google tutorial and also this one and this one but for some reason the push notifications does not work when I define the extension as an extension and not as an application.
Can anyone give some guidance? my code is basically identical to the 2nd tutorial only I am defining the extensions as an extension and not as an application.
To my understanding it might be impossible due to safety reasons(?)..
Any help will be appreciated...
Can I use GCM for a chrome EXTENSION?
Yes you can. GCM docs states that:
For Chrome apps and extensions, GCM enables Chrome instances to send
and receive message data from servers. The
chrome.gcm API allows the
Chrome apps or extensions to access the GCM service. The service works
even if an app or extension isn't currently running. For example,
calendar updates could be pushed to users even when their calendar app
isn't open.
Receive downstream messages
chrome.gcm.onMessage.addListener(function(message) {
// A message is an object with a data property that
// consists of key-value pairs.
});
There's also a dev blog guide that you might want to see. It includes sample codes and instructions like:
How push messaging works
1) Chrome extension gets a Channel ID from Chrome Run-time
2) After receiving Channel ID, your extension sends the channel ID to your web server.
3) Using GCM API, you can send a message to chrome browser which will queued in GCM Server.
4) GCM server sends your message to Chrome Run-time.
5) Chrome Run-time forwards the message to your extension.

How do I make notications appear on Chrome and Chrome OS, like Pushbullet and Google Now?

Pushbullet and Google Now have notifications, which can pop up depending on time or place or any other trigger. If I have to add this feature to my app, how can I do it?
You have two options:
https://developer.chrome.com/extensions/notifications as pointed out by #Moin in the comments. This will only work for people that decide to install your chrome app on desktop (no support for chrome in Android)
Using the new push notifications APIs as described in
https://developers.google.com/web/fundamentals/getting-started/push-notifications/
The latter is probably recommended if you can live with the following caveats:
It's a bit more basic API
Users needs to opt in via a prompt
The site needs to be https

chrome.gcm is only available to apps and extensions, how do I use it as a normal website?

I have heard that push notifications are now supported in Chrome (including Android) as a website, but the documents I can find talk about chrome.gcm as only available in a Chrome App or Chrome Extension. What do I do?
chrome.gcm was a proprietary push API built for Chrome Apps and Extensions which the user has to install.
There is a new API called Push API (spec) which is a web standard based on service workers, and available to normal websites.
This walkthrough explains how to send notifications from your website and should get you up and running: https://developers.google.com/web/fundamentals/getting-started/push-notifications/