diff --git a/angular.json b/angular.json index 2c0022e..52918ca 100644 --- a/angular.json +++ b/angular.json @@ -28,7 +28,7 @@ "src/favicon.ico", "src/assets", "src/manifest.webmanifest", - "src/assets/firebase-messaging-sw.js" + "src/firebase-messaging-sw.js" ], "styles": [ "node_modules/primeng/resources/themes/bootstrap4-light-blue/theme.css", diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 8b86f59..b1e15c8 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -31,6 +31,7 @@ import { RefSystemComponent } from './pages/account/ref-system/ref-system.compon import { QRCodeModule } from 'angularx-qrcode'; import { ShareButtonsModule } from 'ngx-sharebuttons/buttons'; import { ShareIconsModule } from 'ngx-sharebuttons/icons'; +import { MessagingService } from './services/messaging.service'; @NgModule({ declarations: [ @@ -79,7 +80,7 @@ import { ShareIconsModule } from 'ngx-sharebuttons/icons'; }), ShareIconsModule ], - providers: [DialogService, MessageService, ], + providers: [DialogService, MessageService, MessagingService ], bootstrap: [AppComponent] }) export class AppModule { } diff --git a/src/app/pages/main/main.component.ts b/src/app/pages/main/main.component.ts index 44c00f0..a2ba62c 100644 --- a/src/app/pages/main/main.component.ts +++ b/src/app/pages/main/main.component.ts @@ -4,6 +4,7 @@ import { ActivatedRoute } from "@angular/router"; import { CardComponent } from "src/app/components/card/card.component"; import { AccountComponent } from "../account/account.component"; import {MessageService} from 'primeng/api'; +import { MessagingService } from "src/app/services/messaging.service"; @Component({ @@ -17,7 +18,8 @@ export class MainComponent implements OnInit { public messagingToken!: string | null; public deferredPrompt: any; public isPermissionNotifications: boolean = false; - public token = '' + public token = ''; + public message: any; constructor( private route: ActivatedRoute, @@ -25,7 +27,8 @@ export class MainComponent implements OnInit { private afMessaging: AngularFireMessaging, public el: ElementRef, public renderer: Renderer2, - private messageService: MessageService + private messageService: MessageService, + private messagingService: MessagingService ) { renderer.listen('window', 'appinstalled', (evt) => { console.log('INSTALLED!!!') @@ -61,34 +64,39 @@ export class MainComponent implements OnInit { } requestPermission() { - if (!('serviceWorker' in navigator)) { - this.messageService.add({severity:'error', summary:'Не поддерживается в Вашем браузере!'}); - return; - } + // if (!('serviceWorker' in navigator)) { + // this.messageService.add({severity:'error', summary:'Не поддерживается в Вашем браузере!'}); + // return; + // } - if (!('PushManager' in window)) { - // Браузер не поддерживает push-уведомления. - this.messageService.add({severity:'error', summary:'Не поддерживается в Вашем браузере!'}); - return; - } - this.afMessaging.requestPermission.subscribe({ - next: () => { - console.log('Permission granted! Save to the server!') - }, - error: e => console.error(e) - }) + // if (!('PushManager' in window)) { + // // Браузер не поддерживает push-уведомления. + // this.messageService.add({severity:'error', summary:'Не поддерживается в Вашем браузере!'}); + // return; + // } + // this.afMessaging.requestPermission.subscribe({ + // next: () => { + // console.log('Permission granted! Save to the server!') + // }, + // error: e => console.error(e) + // }) - this.afMessaging.requestToken.subscribe({ - next: (token) => { - this.messagingToken = token; - if (this.messagingToken) { - this.messageService.add({severity:'success', summary:'Спасибо за подписку!'}); - this.isPermissionNotifications = true; - } - console.log(token) - }, - error: e => console.error(e) - }) + // this.afMessaging.requestToken.subscribe({ + // next: (token) => { + // this.messagingToken = token; + // if (this.messagingToken) { + // this.messageService.add({severity:'success', summary:'Спасибо за подписку!'}); + // this.isPermissionNotifications = true; + // } + // console.log(token) + // }, + // error: e => console.error(e) + // }) + + const userId = 'user001'; + this.messagingService.requestPermission(userId) + this.messagingService.receiveMessage() + this.message = this.messagingService.currentMessage } // test function diff --git a/src/app/services/messaging.service.ts b/src/app/services/messaging.service.ts index e69de29..87ea83d 100644 --- a/src/app/services/messaging.service.ts +++ b/src/app/services/messaging.service.ts @@ -0,0 +1,69 @@ +import { Injectable } from '@angular/core'; +// import { AngularFireDatabase } from '@angular/fire/database'; +// import { AngularFireAuth } from '@angular/fire/auth'; +import { AngularFireMessaging } from '@angular/fire/compat/messaging'; +import { BehaviorSubject } from 'rxjs'; + +@Injectable() +export class MessagingService { + currentMessage = new BehaviorSubject(null); + + constructor( + // private angularFireDB: AngularFireDatabase, + // private angularFireAuth: AngularFireAuth, + private angularFireMessaging: AngularFireMessaging + ) { + this.angularFireMessaging.messages.subscribe((_messaging: any) => { + _messaging.onMessage = _messaging.onMessage.bind(_messaging); + _messaging.onTokenRefresh = _messaging.onTokenRefresh.bind(_messaging); + }); + } + + /** + * update token in firebase database + * + * @param userId userId as a key + * @param token token as a value + */ + + // ОБНОВИТЬ/ДОБАВИТЬ ТОКЕН В БД + + // updateToken(userId, token) { + // // we can change this function to request our backend service + // this.angularFireAuth.authState.pipe(take(1)).subscribe( + // () => { + // const data = {}; + // data[userId] = token + // this.angularFireDB.object('fcmTokens/').update(data) + // }) + // } + + /** + * request permission for notification from firebase cloud messaging + * + * @param userId userId + */ + requestPermission(userId: string) { + this.angularFireMessaging.requestToken.subscribe({ + next: (token) => { + // this.messagingToken = token; + // if (this.messagingToken) { + // this.messageService.add({severity:'success', summary:'Спасибо за подписку!'}); + // this.isPermissionNotifications = true; + // } + console.log(token); + }, + error: (e) => console.error(e), + }); + } + + /** + * hook method when new notification received in foreground + */ + receiveMessage() { + this.angularFireMessaging.messages.subscribe((payload: any) => { + console.log('new message received. ', payload); + this.currentMessage.next(payload); + }); + } +}