使用 Azure Notification Hubs 的 Web 推送通知

本文介绍如何使用Azure Notification Hubs向单个用户发送浏览器推送通知。

概括而言，此过程为：

1. 设置凭据：

   • 在 Azure 门户 中
   • 使用 REST API
   • 使用 Azure SDKs

2. 创建注册和安装。

3. 发送推送通知：

   • 直接发送
   • 批量发送（给受众）
   • 调试/测试发送

概述

Web 推送（或 浏览器推送）是一种通知，客户在其桌面浏览器上获取，在某些情况下，移动浏览器基于每个网站。

Azure Notification Hubs 现在支持所有主要浏览器的浏览器推送功能，包括 Microsoft Edge、Google Chrome 和 Mozilla Firefox。 不包括 Apple Safari。 对于 Apple Safari，可以使用现有的 APNS 支持，如 配置 Safari 推送通知中所述，使用基于证书的身份验证。

在以下操作系统和浏览器的设备上跨平台支持浏览器推送。

笔记本电脑上的浏览器推送支持：

平板电脑上的浏览器推送支持：

移动设备上的浏览器推送支持：

设置凭据

若要订阅网站上的浏览器推送通知，可以使用 VAPID 密钥。 可以使用 VAPID 密钥生成器等服务生成 VAPID 凭据。 凭据应类似于以下示例：

{ 
    "location": "China East", 
    "properties": { 
        "browserCredential": { 
            "properties": { 
                "subject": "mailto:email@microsoft.com", 
                "vapidPublicKey": "some-vapid-public-key", 
                "vapidPrivateKey":"some-vapid-private-key" 
            } 
        } 
    } 
} 

在 Azure 门户中设置凭据

若要在 Azure 门户中设置浏览器推送凭据，请执行以下步骤：

1. 在 Azure 门户中，打开通知中心的 Browser （Web Push） 边栏选项卡。

   

2. 输入现有的 VAPID 密钥，或使用 VAPID 密钥生成器等服务生成新的 VAPID 密钥对。

3. 选择“保存”。

使用 REST API 设置凭据

还可以使用 REST API 设置浏览器推送的浏览器凭据，例如使用 创建或更新 Hub REST API 方法、Azure Resource Manager API 或 V2 RP。

按以下格式输入凭据：提供订阅 ID、资源组、命名空间和通知集线器。

https://management.chinacloudapi.cn/subscriptions/{subscription}/resourceGroups/{resource-group}/providers/Microsoft.NotificationHubs/namespaces/{namespace}/notificationHubs/{hub}api-version=2016-03-01

使用 Azure SDKs 设置凭据

可以使用Azure SDK设置浏览器推送通知所需的凭据。 下面是使用 .NET SDK 的示例：

var browserCreds = new BrowserCredential 
{ 
    Subject = "<subject>", 
    VapidPublicKey = "<vapid public key>", 
    VapidPrivateKey = "<vapid private key>", 
} 

和：

await nhManagementClient.NotificationHubs.CreateOrUpdateAsync(config.ResourceGroupName, config.NamespaceName, config.HubName, new NotificationHubCreateOrUpdateParameters(config.Location) 
{ 
   BrowserCredential = browserCreds 
});

创建注册和安装

批量发送需要注册或安装。 还可以在调试发送中使用注册和安装。

以下示例显示了本机注册、模板注册和浏览器安装的注册请求正文。

本机注册请求正文

<?xml version="1.0" encoding="utf-8"?><entry xmlns="http://www.w3.org/2005/Atom"><content type="application/xml"><BrowserRegistrationDescription xmlns:i="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://schemas.microsoft.com/netservices/2010/10/servicebus/connect"><Endpoint></Endpoint><P256DH></P256DH><Auth></Auth></BrowserRegistrationDescription></content></entry> 

浏览器模板注册请求正文

<?xml version="1.0" encoding="utf-8"?> 
<entry xmlns="http://www.w3.org/2005/Atom"> 
    <content type="application/xml"> 
        <BrowserTemplateRegistrationDescription xmlns:i="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://schemas.microsoft.com/netservices/2010/10/servicebus/connect"> 
            <Endpoint></Endpoint> 
            <P256DH></P256DH> 
            <Auth></Auth> 
            <BodyTemplate><![CDATA[{"title":"asdf","message":"xts"}]]></BodyTemplate> 
        </BrowserTemplateRegistrationDescription> 
    </content> 
</entry> 

安装请求正文

{  
    "installationId": "installation-id", 
    "platform": "browser", 
    "pushChannel": { 
            "endpoint": "", 
            "p256dh": "", 
            "auth": "" 
        } 
}   

创建原生注册（SDK）

await notificationHubClient.CreateBrowserNativeRegistrationAsync(subscriptionInfo, tagSet);

创建模板注册 （SDK）

await notificationHubClient.CreateBrowserTemplateRegistrationAsync(subscriptionInfo, template, tagSet);

创建浏览器安装 (SDK)

var browserPushSubscription = new BrowserPushSubscription 
            { 
                Endpoint = "", 
                P256DH = "", 
                Auth = "", 
            }; 

var browserInstallation = new BrowserInstallation 
            { 
                InstallationId = installationId, 
                Tags = tags, 
                Subscription = browserPushSubscription, 
                UserId = userId, 
                ExpirationTime = DateTime.UtcNow.AddDays(1), 
            }; 

await notificationHubClient.CreateOrUpdateInstallationAsync(browserInstallation);

发送推送通知

在为浏览器推送设置凭据并为设备创建设备注册和安装后，即可创建推送通知。 本部分介绍如何为 直接发送|、 访问群体发送和 调试（测试）发送创建通知。

创建直接发送

对于直接发送，需要来自浏览器订阅的终结点 URI、p25DH 密钥和身份验证机密。 有关直接发送通知的详细信息，请参阅 直接发送。

若要创建直接发送通知，请执行以下步骤：

1. 为浏览器推送设置以下标头：

   • ServiceBusNotification-Format - browser
   • ServiceBusNotification-DeviceHandle - endpoint endpoint：订阅中的字段
   • P256DH p256dh：订阅中的字段
   • Auth auth：订阅中的字段

2. 创建消息正文。 消息正文通常采用以下格式：

   { 
     "title": "Some Title", 
     "body": "Some body of a message" 
   } 
   

   可以在正文中指定其他字段;例如， icon若要更改每个消息的图标。

3. 发送通知。

还可以使用 .NET SDK 创建直接发送：

var browserSubscriptionEndpoint = ""; 
var browserPushHeaders = new Dictionary<string, string> 
            { 
               { "P256DH", "" }, 
               { "Auth", "" }, 
            }; 

var directSendOutcome = await notificationHubClient.SendDirectNotificationAsync(new BrowserNotification("payload", browserPushHeaders), browserSubscriptionEndpoint);

创建用户群发送

对于目标受众发送，请使用与直接发送相同的 ServiceBus Notification-Format 标头，并根据需要修改消息有效负载。 （可选）使用 ServiceBusNotification-Tags 标头指定标记表达式。 有关创建受众发送的详细信息，请参阅 发送 APNS 原生通知。

若要使用 SDK 创建发送目标受众，请使用以下语句：

var outcome = await notificationHubClient.SendNotificationAsync(new BrowserNotification(payload, tagExpression);

创建调试/测试发送

调试发送是在Azure门户中创建的，需要注册和安装。

为设备创建注册后，请按照以下步骤创建调试发送通知：

1. 在 Azure 门户中，打开通知中心的 Test Send 边栏选项卡。

   

2. 在 “平台 ”字段中，选择 “浏览器”。

3. 指定 发送到标记表达式。

4. 将 Payload 修改为所需的消息。

5. 选择发送。

后续步骤

• 了解有关直接发送的详细信息
• 将批处理直接发送到设备句柄集合