I'm building a PWA using the latest version of Angular.
I'm making use of the Angular Mobile Toolkit and I want to send Local Notifications using angular/service-worker. But I can't make it work.
I'm able to subscribe and send notification from a server, but I would like to send a notification from my app itself. I tried using angular2-notifications, it works well on a desktop, but the constructor
new Notification(title, options)
from the Notification API doesn't work anymore on Android, so it doesn't suit me.
Is there any way to use angular/service-worker to send local notifications on Android (Chrome)? Or maybe another alternative.
EDIT
Maciej answer pointed me to the right direction, I was able to make it work using the following piece of code
navigator.serviceWorker.getRegistration()
.then((reg) => {
reg.showNotification(title, noti);
});
P.S.: Be aware that I used this together with angular/service-worker. I used angular/service-worker to register the service-worker and the code above uses the registered service-worker. Also, be aware that for the service-worker to work you need a secure connection.
Chrome on Android is not compatible with the Notification API from HTML5, so you won't be able to send local notifications.
As far as I can see in the @angular/service-worker source code, for displaying notifications, they are using following method:
this.worker.showNotification(desc['title'], options);
this.worker is an object of type VersionWorker.
So probably there is some way to reuse this.worker for your use.
Full code of Push plugin written by Angular team, can be found here: https://github.com/angular/mobile-toolkit/blob/master/service-worker/worker/src/plugins/push/index.ts
Example repo for service-worker plugin can be found here: https://github.com/maciejtreder/ng-http-sw-proxy (catalog plugin).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With