Web プッシュ通知 (WPN)

WPN の有効化

サービス・ワーカー

通知へのサブスクライブおよびアンサブスクライブ

• 通知のサブスクライブ: 完全な実装作業であり、デフォルトでは、アプリケーションはログイン・プロセス中にサブスクライブするフックを提供します。 ログイン直後に、アプリケーションは src/app/core/services/PushNotificationAbstractService 内で定義されているメソッドをサブスクライブするための呼び出しを行います (今日の時点では、これは単なるダミー・メソッドです)。 ユーザーが通知にサブスクライブできるようにサブスクライブ方式を実装するには、 PushNotificationAbstractService をオーバーライドする必要があります。このサブスクリプションは、お客様の側のどこかで永続化することができます。 同じカスタマイズ・サービスをアプリケーション内の任意の場所から呼び出して、デフォルトの動作 (ログイン時のサブスクリプション) を変更することができます。
• 通知のアンサブスクライブ: src/app/core/services/PushNotificationAbstractService からのダミーのアンサブスクライブ・メソッドも、アプリケーション提供のフローのログアウト時に呼び出されるため、お客様のニーズに合わせてオーバーライドする必要があります。 非常に基本的に、オーバーライドされたサービスはこのようになります (オーバーライドされたサービスは store-extensions-src/app/core/services/ 内で定義する必要があります)。
  注: これは非常に基本的な実装であり、実動アプリケーションには望ましくありません。

import { Injectable, Injector } from '@angular/core';
import { PushNotificationAbstractService } from '@simcore/
services/push-notification-abstract.service';
import { SwPush } from '@angular/service-worker';
import { HttpClient, HttpResponse } from '@angular/common/http';
import { map, take } from 'rxjs/operators';
import { UIUtilsService } from '@sim-core/services/uiutils.
service';
@Injectable({
providedIn: 'root'
})
export class PushNotificationService extends
PushNotificationAbstractService {
readonly VAPID_PUBLIC_KEY = '<vapid key>';
isWPNSubscribed = false;
subsObj = null;
constructor(
protected injector: Injector,
public swPush: SwPush,
private http: HttpClient
) {
super(injector);
if (this.swPush.isEnabled) {
this.swPush.subscription
.pipe(take(1))
.subscribe(pushSubscription => {
if (pushSubscription) {
this.isWPNSubscribed = true;
}
});
}
}
public subscribe({}) {
this.subscribeToNotifications(null);
}
subscribeToNotifications(event) {
if (event) {
event.preventDefault();
}
this.swPush.requestSubscription({
serverPublicKey: this.VAPID_PUBLIC_KEY
})
.then(pushSubscription => {
this.http.post('https://<host-port>/<susbcribe-end-point>',
{'subscription': pushSubscription.toJSON(), 'any-other-data':''});
this.isWPNSubscribed = true;
})
.catch(err => console.error('Could not subscribe to
notifications', err));
}
public unsubscribe({}) {
this.unsubscribeToNotifications(null);
}
unsubscribeToNotifications(event) {
event.preventDefault();
this.swPush.subscription
.pipe(take(1))
.subscribe(pushSubscription => {
pushSubscription.unsubscribe().then(result => {
if (result) {
this.isWPNSubscribed = false;
this.http.post('https://<host-port>/<unsusbcribe-endpoint>',
{'data': 'data'})
} else {
console.log('Could not unsubscribe to notifications');
}
})
.catch(err => console.error('unsubcribe subscription failed',
err));
});
}
}

プッシュ・サービスの呼び出し

プッシュ・サービスの呼び出しは完全なカスタム実装であり、お客様が行う必要があります。 一般的に、 Sterling Store Engagement または IBM® Sterling Order Management Systemで 発生したイベントはキャプチャされなければならず、関連するユーザーに表示されるためには、正しいデータでプッシュサービスが起動されなければならない。

{
"notification": {
"title": "Notification Title", //mandatory
"body": "Notification Message!",
"data": {
"dateOfArrival": Date.now(),
"primaryKey": 1
}
}
}

プッシュ・イベントおよび通知クリック・イベントの処理

this.swPush.messages.subscribe(message => {
console.log('Push message: ', message);
});
this.swPush.notificationClicks.subscribe(notificationMsg => {
console.log('Notification Click: ', notificationMsg);
});

制限