时间戳

首页 > 解决方案 > 角度通知未显示本机弹出窗口询问权限

angular - 角度通知未显示本机弹出窗口询问权限

问题描述

我正在使用 Angular 8 作为 pwa。我添加了相关模块来启用网络通知。在请求通知权限时，预计会显示一个本机弹出窗口，单击它会向我们提供端点详细信息。但是这个弹出窗口没有显示，并且承诺永远不会得到解决。

我正在使用带有 web-push 的快速服务器来发送通知。该服务器也为 Angular 应用程序提供服务。我已经看到了这些问题，冻结问题，pushManager 问题，但找不到解决方案。我已经完成了 Angular 应用程序的产品构建。

我调试了 service-worker.js 文件（来自 node_moduels/@angular/service-worker），发现

this.pushManager = this.sw.registration.pipe(map((/**
   * @param {?} registration
   * @return {?}
   */
   registration => registration.pushManager)));

此推送管理器 observable 稍后用于获取端点数据，但执行永远不会进一步进入管道。浏览器支持服务人员和应用程序的其余部分都可以正常工作。

这是我使用的直接来自文档的代码。

init() {
    this.push.requestSubscription({ serverPublicKey: <my pub key> })
    .then(
      (success) => {
        console.log(success);
        this.subscriptionDetails = success;
        this.http.post('http://localhost:9020/<sub-endpoint>', success).subscribe(() => {
          this.push.messages.subscribe(message => console.log(message));
        });
      },
      (error) => console.error(error)
    ).catch(err => console.error('requestSubscription Error: ',err));
  }

错误和成功都没有得到安慰，promise 从未得到解决，并且询问用户权限的本机弹出窗口从未显示。我已经检查了 chrome 设置，看看权限是否已经存在。

期望代码显示一个本机弹出窗口，询问用户是否允许通知。授予权限应该解决承诺并产生端点数据。

标签： angularpush-notification

解决方案

你可以试试这样：

.then(sub => register(sub))
.catch(err => console.error('requestSubscription Error: ',err));

register(success){
    this.subscriptionDetails = success;
    this.http.post('http://localhost:9020/<sub-endpoint>', success).subscribe(() => {
      this.push.messages.subscribe(message => console.log(message));
    });
}

您还需ng build --prod要让服务人员正常工作。

推荐阅读