你当前正在访问 Microsoft Azure Global Edition 技术文档网站。如果需要访问由世纪互联运营的 Microsoft Azure 中国技术文档网站，请访问 https://docs.azure.cn。

使用 Azure 通知中心的 Web 推送通知

2025-06-23

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

概括而言，此过程为：

设置凭据：
创建注册和安装。
发送推送通知：

概述

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

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

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

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

操作系统	浏览器
Windows 操作系统	Google Chrome v48+ Microsoft Edge v17+ Mozilla Firefox v44+ Safari v7+ Opera v42+
macOS	Chrome v48+ Firefox v44+ Safari v7+ Opera v42+
Linux操作系统	Chrome v48+ Firefox v44+ Safari v7+ Opera v42+

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

操作系统	浏览器
Windows 操作系统	Chrome v48+ Firefox v44+ Opera v42+
iOS	不支持。
Android OS	Chrome v48+ Firefox v44+ Opera v42+

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

操作系统	浏览器
iOS	不支持。
Android OS	Chrome v48+ Firefox v44+ Opera v42+

设置凭据

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

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

在 Azure 门户中设置凭据

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

在 Azure 门户中，在通知中心打开 “浏览器”（Web 推送） 边栏选项卡。
输入现有的 VAPID 密钥，或使用 VAPID 密钥生成器等服务生成新的 VAPID 密钥对。
选择“保存”。

使用 REST API 设置凭据

还可以使用 REST API 设置浏览器推送的浏览器凭据，例如使用创建或更新中心 REST API 方法、Azure 资源管理器 API 或 V2 RP。

输入采用此格式的凭据，提供订阅 ID、资源组、命名空间和通知中心：

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

使用 Azure SDK 设置凭据

可以使用 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 密钥和身份验证机密。有关直接发送通知的详细信息，请参阅直接发送。

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

为浏览器推送设置以下标头：
- ServiceBusNotification-Format - browser
- ServiceBusNotification-DeviceHandle - endpoint endpoint：订阅中的字段
- P256DH p256dh：订阅中的字段
- Auth auth：订阅中的字段
创建消息正文。消息正文通常采用以下格式：
```
{ 
  "title": "Some Title", 
  "body": "Some body of a message" 
} 
```
可以在正文中指定其他字段;例如， icon若要更改每个消息的图标。
发送通知。

还可以使用 .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 门户中创建的，需要注册和安装。

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

在 Azure 门户中，打开通知中心的 “测试发送 ”边栏选项卡。
在 “平台 ”字段中，选择 “浏览器”。
指定 发送到标记表达式。
将 有效负载 修改为所需的消息。
选择发送。