Angularfire: AngularFireMessaging requests notifications when added to constructor

[zanozbot]

Version info

Angular: 8.2.14

Firebase: 7.6.1

AngularFire: 5.2.3

How to reproduce these conditions

Steps to set up and reproduce
Add AngularFireMessaging to the constructor of a service or a component.

Expected behavior

The service should initialize without the need to request for notifications.
There should be an option to disable automatic notification request.

From the docs

If you blindly ask for permission you have an extremely high chance of getting denied.

Actual behavior

AngularFireMessaging asks for permission on initialization, resulting in immediate notification request.
https://github.com/angular/angularfire/blob/master/src/messaging/messaging.ts

[jamesdaniels]

It seems like FCM might have introduced a breaking API change on a minor https://github.com/firebase/firebase-js-sdk/pull/2421... I’d suggest rolling back your Firebase version for now. It’s also caused a similar effect in httpsCallable if you’re using that, which had to be patched with the release of Firebase 7.6.2.

[jamesdaniels]

Thoughts @mmermerkaya @Feiyang1?

[zanozbot]

@jamesdaniels actually, the newest release of firebase 7.6.2. fixes the issue described. The permission is no longer requested on service initalization.

[sidsakhadeo]

@zanozbot @jamesdaniels I'm seeing the same issue even after upgrading to the 7.6.2 version for Firebase. Have you found another workaround for this issue?

[metalllus]

I get the permission request upon using the getToken() method and also the tokenChanges observable which wasn't the case with older versions of Firebase. Is it somehow possible to get around this?

[ayyash]

i'm at 7.8 and the tokenChanges still fires a permission request, so what I ended it up doing is this

 if (Notification.permission === 'granted') {

                            this.afMessaging.tokenChanges.subscribe(() => {
                                this.afMessaging.getToken.subscribe(token => {
                                    _attn(token, 'afnew token');
                                    this.AddSubscriber(token).subscribe();
                                });
                            });


                        }

[metalllus]

i'm at 7.8 and the tokenChanges still fires a permission request, so what I ended it up doing is this

 if (Notification.permission === 'granted') {

                            this.afMessaging.tokenChanges.subscribe(() => {
                                this.afMessaging.getToken.subscribe(token => {
                                    _attn(token, 'afnew token');
                                    this.AddSubscriber(token).subscribe();
                                });
                            });


                        }

you saved my life, thx man

[johanchouquet]

 if (Notification.permission === 'granted') {

                            this.afMessaging.tokenChanges.subscribe(() => {
                                this.afMessaging.getToken.subscribe(token => {
                                    _attn(token, 'afnew token');
                                    this.AddSubscriber(token).subscribe();
                                });
                            });


                        }

One subcribe, in another subscribe, in another subscribe... Not the best pattern I believe. In a more Rxjs way, that would be something like:

const tokenChanges$: Observable<any> = this.afMessaging.tokenChanges;
const token$: Observable<any> = tokenChanges$.pipe(
  switchMap(() => this.afMessaging.getToken.pipe(
      tap(token => _attn(token, 'afnew token')),
      map(token => this.AddSubscriber(token))
    )
  )
);
this.tokenSub: Subscription = token$.subscribe(); // don't forget to unubscribe

[jamesdaniels]

this has been addressed on our side in recent patches, there was a breaking change in a minor of the firebase sdk