ionic-team / capacitor

Build cross-platform Native Progressive Web Apps for iOS, Android, and the Web ⚡️
https://capacitorjs.com
MIT License
11.8k stars 994 forks source link

Push notifications in PWA #1282

Open no-1ne opened 5 years ago

no-1ne commented 5 years ago

Folks thank you for capacitor.

Push notifications seem to be supported only in iOS and Android, but not Web, is there any reason for this? Web has notifications API

https://developer.mozilla.org/en-US/docs/Web/API/Notifications_API

Kindly enlighten.

hsta commented 5 years ago

If I would have to take a guess it is currently missing because of the required service worker. I guess a lot of projects already have a service worker. Our projects for example use the ngsw-worker from @angular/pwa, however, other projects may use totally different service workers so capacitor cannot assume if there is one and if so which one it is.

Like stated on https://capacitor.ionicframework.com/docs/basics/progressive-web-app/ writing service workers from scratch is complex. And "forcing" projects to use a certain one or even a new capacitor maintained service worker wouldn't be very good imho.

However, since I also would like to see Push Notification support for PWAs my suggestion would be to write a "smallest possible" service worker "extension", which only implements everything required for Push Notifications. Such a mini service worker could be included in the actual service worker file simply with importScripts('./capacitor-push-notifications-sw.js');. We have quite good experience with using just a 2 lines service worker "container" file which first imports the native Angular service worker and then our custom service worker. This method is agnostic to which "main" service worker is used and updates of the main service worker or its build process. But it would still require some manual setup (adding the importScripts and maybe registering they new "container" service worker). Still I think it could be worth it.

mlynch commented 5 years ago

Agreed, we need to figure out a good solution for service workers (likely what Ionic does: a basic implementation using workbox) and then add push support. Marking this as high priority.

CFT-Chris commented 5 years ago

@mlynch Is there any branch currently that has development started on this task? I could probably help contribute to get this out sooner since I'm dealing with this now in an Ionic+Capacitor project.

CFT-Chris commented 4 years ago

@mlynch @jcesarmobile, any chance this issue and the PR I submitted be discussed soon?

jmdavid commented 4 years ago

Ionic team, please proceed as all tests passed and no conflicts.

tvvignesh commented 4 years ago

@mlynch Since this is still open, I am moving ahead using Workbox separate from Capacitor. In case this gets implemented, I hope the migration process would be smooth for me. Thanks.

ciekawy commented 4 years ago

shouldn't this be as easy as using web-push package (and/or just SwPush) and VAPID / subscription management on the server side? https://blog.angular-university.io/angular-push-notifications/

side note - full integration with Firebase (like the need to create firebase project and wire it into the PWA) sounds to me like an unnecessary overkill in many cases

dthib commented 3 years ago

Hi Capacitor team, Thanks for the great work. Any news on this topic ? Best,

reslear commented 3 years ago

Any news?

spotvin42 commented 2 years ago

Hello, thanks everyone for the work on Capacitor. Just wondering whether this is coming soon?

StefanNedelchev commented 2 years ago

If you use Angular, for now you can use their service worker package

sandstrom commented 2 years ago

Most probably know already, but Web Push Notifications is coming to Safari (both iOS and macOS).

https://webkit.org/blog/12824/news-from-wwdc-webkit-features-in-safari-16-beta/#web-push-for-macos

(I don't know how that would work in a webview app wrapped within a native shell though, which is how most Capacitor apps are packaged on iOS)

StefanNedelchev commented 2 years ago

Most probably know already, but Web Push Notifications is coming to Safari (both iOS and macOS).

https://webkit.org/blog/12824/news-from-wwdc-webkit-features-in-safari-16-beta/#web-push-for-macos

(I don't know how that would work in a webview app wrapped within a native shell though, which is how most Capacitor apps are packaged on iOS)

They have already been available for macOS (I've even implemented them in 2019), it's just a bit different. It's only iOS where they haven't been available.

sandstrom commented 1 year ago

It's now available for iOS too: https://webkit.org/blog/13878/web-push-for-web-apps-on-ios-and-ipados/

Anyone know if this will change how Capacitor-based apps (webviews) use Push Notifications? Or if that will stay the same?

strarsis commented 1 year ago

+1, I want to use it in Ionic as all the other components!

strarsis commented 1 year ago

iOS/iPad OS/macOS Safari support for browser push notifications finally rolled out with 16.4! 🍾

reslear commented 1 year ago

but ok, already work with https://github.com/capawesome-team/capacitor-firebase/tree/main/packages/messaging

khromov commented 1 year ago

Is there a way to utilize web push with Capacitor today? It feels suboptimal to require two push implementations (Web Push for PWA and Firebase for Capacitor in the same code base). If I understand correctly it seems to be possible to use Firebase for all platforms with the capawesome-team/capacitor-firebase package?

mleister97 commented 1 month ago

Hello! Are there any updates regarding this ticket, or is there a roadmap or timeline available?