Angular向所有用户发送紧急警报答案

【问题标题】：Angular sending emergency alert to all usersAngular向所有用户发送紧急警报
【发布时间】：2020-09-23 12:24:25
【问题描述】：

我想向所有最终用户发送紧急警报。就像“紧急”广播通知一样，因为如果我要更新新版本，他们必须在半小时之前保存他们的作品。

我希望它现在清楚了。一旦检查了 UI 的设计，您就会对此有所了解。

这是概念设计： https://i.stack.imgur.com/wRqnU.png like this i want give emergency alert To All

【问题讨论】：

嗨，欢迎来到 SO。请更新您的问题并提供包含相关代码部分的 MRE（stackoverflow.com/help/minimal-reproducible-example）。

标签： sql angular asp.net-web-api

【解决方案1】：

在您的情况下，我认为您必须在尝试更新系统时向用户提供实时通知。那么你应该考虑使用 Push Web Notifications 来通知用户，或者你也可以尝试 socket io 并实现这种类型的功能。

这里是参考链接Socket IO ,Push Web Notifications

【讨论】：

你用过吗？这种类型的任务在任何地方使用 #Angular,#WebApi,#Sql 。实际上我不知道角度我是角度的新手

【解决方案2】：

如果是实时和 Web Socket 实现，您可以使用 Web socket 或 SocketIO 来发送消息。否则你必须使用 Angular PWA 来推送通知。

尝试将PWA 功能添加到您现有的 Angular 应用程序：

ng add @angular/pwa

然后你必须使用 node web-push 生成一个VAPID 密钥对。安装网络推送：

npm install web-push -g

使用以下命令生成 VAPID 密钥对：

web-push generate-vapid-keys --json

然后您必须订阅推送通知。这是一个示例：

app.component.ts

@Component({
    selector: 'app-root',
    template: `
        <button class="button button-primary" (click)="subscribeToNotifications()">
          Subscribe
        </button>
`})
export class AppComponent {

    readonly VAPID_PUBLIC_KEY = "BLBx-hf2WrL2qEa0qKb-aCJbcxEvyn62GDTyyP9KTS5K7ZL0K7TfmOKSPqp8vQF0DaG8hpSBknz_x3qf5F4iEFo";

    constructor(
        private swPush: SwPush,
        private newsletterService: NewsletterService) {}

    subscribeToNotifications() {

        this.swPush.requestSubscription({
            serverPublicKey: this.VAPID_PUBLIC_KEY
        })
        .then(sub => this.newsletterService.addPushSubscriber(sub).subscribe())
        .catch(err => console.error("Could not subscribe to notifications", err));
    }
}

欲了解更多信息，这里有完整指南：Angular Push Notifications: a Complete Step-by-Step Guide

【讨论】：

src/app/app.component.ts:16:13 中的错误 - 错误 NG2003：“AppComponent”类的参数“newsletterService”没有合适的注入令牌。找到 NewsletterService 16 私人 newsletterService：NewsletterService
我得到了这个@ng-Hobby
这是一个示例，用于了解一般流程的工作原理。这是因为您没有实现类newsletterService 并将其注入您的app.module.ts 提供程序。你读过这个：blog.angular-university.io/angular-push-notifications 吗？