直接从 Angular 客户端订阅 Azure 事件网格主题答案

【问题标题】：Subscribing to an Azure Event Grid topic directly from an Angular client直接从 Angular 客户端订阅 Azure 事件网格主题
【发布时间】：2019-11-28 08:19:01
【问题描述】：

我正在开发一个需要响应来自第三方 WebHook 的事件的应用程序。我选择 Azure Event Grid 作为我选择的事件代理，Angular 用于前端，Asp.Net Core 用于后端。

在我当前的解决方案中，我使用 HTTP 触发的 Azure 函数从 WebHook 发布到 Azure 事件网格。此函数将第三方事件格式化为正确的 Azure 事件网格格式（以相关事件用户为主题，事件类型为 WebHook 事件类型）。目前，事件网格事件使用 WebHook Azure 事件网格订阅推送到我的 Asp.Net 后端。

我的问题是一些事件只涉及前端（如提醒/灯光通知），因此我想直接将事件从事件网格发布到前端，而不使用 WebSocket 到后端的端点。

我目前正在使用 SignalR 在 Angular 和 Asp.Net Core 之间创建 WebSocket 连接，但我不想通过发送将被重定向到 Angular 的事件来使我的后端过载。

有没有办法使用 WebSocket 连接直接订阅 Azure 事件网格？就最小推送/轮询而言，最佳解决方案是什么？还是我应该切换到另一个带有 JavaScript 库（如 RabbitMQ）的事件代理？

【问题讨论】：

您是在问，SignalR 服务是否可以订阅事件处理程序？
我在问是否可以使用 SignalR 或原始 WebSocket 连接从客户端（Angular 应用程序）进行订阅。
你能在你的 Asp.Net 和 Angular 应用程序中创建一个 WebHook 端点吗？
在 Asp.Net 中是可能的（因为 Webhook 只是对特定端点的 POST 请求），但我认为不可能在客户端实现
这就是为什么我们需要一种将消息推送到客户端的服务，例如 Web 和移动浏览器、桌面应用程序、服务器、物联网设备和游戏机。 Azure SignalR 服务允许将消息推送到上述连接的客户端。 Azure 函数具有 SignalR 服务的扩展输出绑定，因此与 EventGridTrigger 一起使用只是几行集成代码（将 eventGridEvent.Data 绕过到 SignalRMessage 参数）。

标签： asp.net angular publish-subscribe messagebroker azure-eventgrid

【解决方案1】：

Azure SignalR Service 可以帮助您集成您的客户端，例如 Asp.net、Angular 等，以使用 Azure 事件网格事件。以下屏幕 sn-p 显示了使用 webhook 事件处理程序端点的逻辑订阅者（客户端）的示例。

如上图所示，EventGridTrigger 函数表示 Azure SignalR 服务的集成器。 AF 已针对 SignalR 服务绑定进行了扩展，请参阅here 的更多详细信息。

使用这个扩展，EventGridTrigger 函数作为 SignalR 服务的集成器非常简单和轻量级，请参见以下示例：

#r "Microsoft.Azure.EventGrid"
#r "Microsoft.Azure.WebJobs.Extensions.SignalRService"
#r "Newtonsoft.Json"

using Microsoft.Azure.EventGrid.Models;
using Newtonsoft.Json;
using Newtonsoft.Json.Linq;
using Microsoft.Azure.WebJobs.Extensions.SignalRService;

public static async Task Run(EventGridEvent eventGridEvent, IAsyncCollector<SignalRMessage> signalRMessages, ILogger log)
{
    await signalRMessages.AddAsync(
        new SignalRMessage
        {
            Target = "Notify",
            Arguments = new[] { eventGridEvent.Data.ToString() }
        });
}

和function.json：

{
  "bindings": [
    {
      "type": "eventGridTrigger",
      "name": "eventGridEvent",
      "direction": "in"
    },
    {
      "type": "signalR",
      "name": "signalRMessages",
      "hubName": "mySignalRService/users/myClientId",
      "connectionStringSetting": "AzureSignalRConnectionString",
      "direction": "out"
    }
  ]
}

此外，请查看更多在客户端使用 Azure SignalR 服务的示例（例如 codeproject、github、here）。

【讨论】：