Angular 7 pwa / SwPush – 推送通知不起作用

我正在尝试使用@ angular / pwa link和使用SwPush在Angular 7中进行推送通知.我无法获得实际推送通知.
我目前正在使用localhost(通过在执行ng-build之后运行http-server)并且我的api服务器位于云中.
我能够使用swPush.requestSubscription启用订阅,并且订阅已在服务器上成功注册.
在Chrome中,所有api调用都被服务工作者本身阻止(失败：来自服务工作者),而在Firefox中,没有错误,但推送消息没有出现.

我在下面添加了相关的代码片段.由于没有报告具体错误,我无法继续进行.

请告知如何进行此项工作并显示通知.

app.module.ts

import {PushNotificationService} from 'core';
import { ServiceWorkerModule } from '@angular/service-worker';
@NgModule({
declarations: [
    AppComponent,],imports: [

    ServiceWorkerModule.register('ngsw-worker.js',{ enabled: true })
],providers: [
    PushNotificationService,exports: [],bootstrap: [AppComponent]
   })
 export class AppModule {
  }


   app.component.ts
export class AppComponent  {

constructor(private pushNotification :PushNotificationService,private swPush : SwPush){
this.swPush.messages.subscribe(notification => {
          const notificationData: any = notification;
     const options = {
      body: notificationData.message,badgeUrl: notificationData.badgeUrl,icon: notificationData.iconUrl
    };
    navigator.serviceWorker.getRegistration().then(reg => {
      console.log('showed notification');
      reg.showNotification(notificationData.title,options).then(res => {
        console.log(res);
      },err => {
        console.error(err);
      });
    });
  });

}
     isSupported() {
      return this.pushNotification.isSupported;
   }

  isSubscribed() {
  console.log(' ****** profile component' + this.swPush.isEnabled);
  return this.swPush.isEnabled;
}

 enablePushMessages() {
  console.log('Enable called'); 
  this.pushNotification.subscribeToPush();

}

 disablePushMessages(){
  // code for unsubsribe
  }
}

push.notification.service

export class PushNotificationService {
 public isSupported = true;
 public isSubscribed = false;
 private swRegistration: any = null;
  private userAgent = window.navigator.userAgent;
 constructor(private http: HttpClient,private swPush: SwPush) {
   if ((this.userAgent.indexOf('Edge') > -1) || 
   (this.userAgent.indexOf('MSIE') > -1) || (this.userAgent.indexOf('.Net') 
    > -1)) {
      this.isSupported = false;
    }
}

subscribeToPush() {
// Requesting messaging service to subscribe current client (browser)
  let publickey = 'xchbjhbidcidd'
   this.swPush.requestSubscription({
    serverPublicKey: publickey
   }).then(pushSubscription => {
     console.log('request push subscription ',pushSubscription);
     this.createSubscriptionOnServer(pushSubscription);
      })
  .catch(err => {
    console.error(err);
  });
}

 createSubscriptionOnServer(subscription) {
  let urlName = 'api/user/notificationSubscription';
  let params;
  params = {
  endpoint: subscription.endpoint,};
this.http.put<any>(urlName,params,httpOptions).pipe(
  tap((res) => {
    if (res.data) {
      if (res.data.success) {
        alert('Success')
      } else {
        alert('error')
      }
    }
  }));
 }
 }