Delen via

Webpushmeldingen met Azure Notification Hubs

In dit artikel wordt beschreven hoe u pushmeldingen van browsers verzendt naar individuele gebruikers met behulp van Azure Notification Hubs.

Op hoog niveau is het proces:

  1. Inloggegevens instellen

  2. Maak registraties en installaties.

  3. Pushmeldingen verzenden:

Overzicht

Webpush (of browserpush) is een type melding dat klanten ontvangen op hun desktopbrowsers, of in sommige gevallen mobiele browsers, per website.

Azure Notification Hubs ondersteunt nu browserpush voor alle belangrijke browsers, waaronder Microsoft Edge, Google Chrome en Mozilla Firefox. Apple Safari is niet inbegrepen. Voor Apple Safari kunt u bestaande APNS-ondersteuning gebruiken, zoals beschreven in Safari-pushmeldingen configureren, met verificatie op basis van certificaten.

Browserpush wordt ondersteund op verschillende platforms op apparaten met de volgende besturingssystemen en browsers.

Push-ondersteuning voor browsers op laptopcomputers:

besturingssysteem Browsers
Windows-besturingssysteem Google Chrome v48+
Microsoft Edge v17+
Mozilla Firefox v44+
Safari v7+
Opera v42+
macOS Chrome v48+
Firefox v44+
Safari v7+
Opera v42+
Linux-besturingssysteem Chrome v48+
Firefox v44+
Safari v7+
Opera v42+

Pushondersteuning voor browsers op tablet-pc's:

besturingssysteem Browsers
Windows-besturingssysteem Chrome v48+
Firefox v44+
Opera v42+
Ios Wordt niet ondersteund.
Android-besturingssysteem Chrome v48+
Firefox v44+
Opera v42+

Pushondersteuning voor browsers op mobiele apparaten:

besturingssysteem Browsers
Ios Wordt niet ondersteund.
Android-besturingssysteem Chrome v48+
Firefox v44+
Opera v42+

Inloggegevens instellen

Als u zich wilt abonneren op pushmeldingen van browsers op uw website, kunt u DAMPID-sleutels gebruiken. U kunt DAMPID-referenties genereren met behulp van services zoals de GENERATOR van de DAMPID-sleutel. De referenties moeten er ongeveer uitzien als in het volgende voorbeeld:

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

Inloggegevens instellen in Azure Portal

Voer de volgende stappen uit om browser-pushreferenties in de Azure-portal in te stellen:

  1. Open de blade Browser (Web Push) in uw Notification Hub in de Azure Portal.

    Schermopname van het Browser (Web Push) blad in Notification Hubs.

  2. Voer uw bestaande DAMPID-sleutels in of genereer een nieuw DAMPID-sleutelpaar met behulp van een service zoals de DAMPID-sleutelgenerator.

  3. Selecteer Opslaan.

Referenties instellen met REST API

U kunt ook de browserreferenties voor browserpush instellen met behulp van de REST API, zoals het gebruik van de methode Create of update Hub REST API , de Azure Resource Manager-API of de V2 RP.

Voer de inloggegevens in dit formaat in, waarbij u de abonnements-ID, resourcegroep, naamruimte en Notification Hub opgeeft.

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

Referenties instellen met behulp van Azure SDK's

U kunt de referenties voor browserpush instellen met behulp van de Azure SDK's. Hier volgt een voorbeeld met behulp van de .NET SDK:

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

en:

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

Registraties en installaties maken

Voor bulksgewijs verzenden zijn registraties of installaties vereist. U kunt ook de registraties en installaties gebruiken bij het verzenden van foutopsporingsinformatie.

In de volgende voorbeelden ziet u de hoofdtekst van de registratieaanvraag voor een systeemeigen registratie, een sjabloonregistratie en een browserinstallatie.

Hoofdtekst van systeemeigen registratieaanvraag

<?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>

Hoofdtekst van registratieaanvraag voor browsersjablonen

<?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>

Hoofdtekst van installatieaanvraag

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

Systeemeigen registraties (SDK) maken

await notificationHubClient.CreateBrowserNativeRegistrationAsync(subscriptionInfo, tagSet);

Sjabloonregistraties maken (SDK)

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

Browserinstallaties maken (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);

Pushmeldingen verzenden

Nadat u referenties hebt ingesteld voor het pushen van browsers en registraties en installaties voor de apparaten hebt gemaakt, kunt u pushmeldingen maken. In deze sectie wordt beschreven hoe u een melding maakt voor een directe send|, doelgroep verzenden en foutopsporing (test) verzenden.

Directe verzendingen maken

Voor een directe verzend hebt u de eindpunt-URI, p25DH-sleutel en verificatiegeheim van een browserabonnement nodig. Zie Direct verzenden voor meer informatie over meldingen van direct verzenden.

Voer de volgende stappen uit om een melding voor direct verzenden te maken:

  1. Stel de volgende headers in voor browserpush:

    • ServiceBusNotification-Format - browser
    • ServiceBusNotification-DeviceHandle - endpoint: het endpoint veld van het abonnement
    • P256DH: het p256dh veld van het abonnement
    • Auth: het auth veld van het abonnement

  2. Maak de hoofdtekst van het bericht. De hoofdtekst van het bericht heeft doorgaans de volgende indeling:

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

    U kunt andere velden in de hoofdtekst opgeven; bijvoorbeeld icon, om het pictogram per bericht te wijzigen.

  3. Verzend de melding.

U kunt ook de .NET SDK gebruiken om een directe verzendfunctie te maken:

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

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

Maak doelgroepverzendingen

Gebruik voor het verzenden naar een doelgroep dezelfde ServiceBus Notification-Format koptekst die wordt gebruikt voor een directe verzending, en wijzig de berichtinhoud naar wens. Geef eventueel een tagexpressie op met behulp van de ServiceBusNotification-Tags header. Zie voor meer informatie over het verzenden naar een doelgroep, Een APNS-melding verzenden.

Als u een doelgroep wilt maken die via de SDK wordt verzonden, gebruikt u de volgende instructie:

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

Fouten opsporen/testen verzenden

Foutopsporingsverzendingen worden gemaakt in de Azure portal en vereisen registraties en installaties.

Nadat u registraties voor de apparaten hebt gemaakt, volgt u deze stappen om een melding voor het verzenden van foutopsporing te maken:

  1. Open de blade Test Verzenden in uw meldingen hub in de Azure portal.

    Schermopname van de testverzending-bladzijde in een notificatiehub voor het verzenden van een test-/foutopsporingsmelding.

  2. Selecteer Browser in het veld Platform.

  3. Geef Send to Tag Expression op.

  4. Wijzig payload in het gewenste bericht.

  5. Klik op Verzenden.

Volgende stappen