Zelfstudie: Meldingen verzenden naar UWP-apps met behulp van Azure Notification HubsTutorial: Send notifications to Universal Windows Platform apps using Azure Notification Hubs

In deze zelfstudie maakt u een Notification Hub om pushmeldingen te verzenden naar een UWP-app (Universal Windows Platform).In this tutorial, you create a notification hub to send push notifications to a Universal Windows Platform (UWP) app. U maakt een lege Windows Store-app die pushmeldingen ontvangt via Windows Push Notification Service (WNS).You create a blank Windows Store app that receives push notifications by using the Windows Push Notification Service (WNS). Vervolgens gebruikt u uw Notification Hub om pushmeldingen te verzenden naar alle apparaten waarop uw app wordt uitgevoerd.Then, you use your notification hub to broadcast push notifications to all devices that are running your app.

Notitie

De volledige code voor deze zelfstudie vindt u op GitHub.You can find the completed code for this tutorial on GitHub.

U voert de volgende stappen uit:You take the following steps:

  • Een app maken in Windows StoreCreate an app in Windows Store
  • Een Notification Hub makenCreate a notification hub
  • Een voorbeeld-app voor Windows makenCreate a sample Windows app
  • Testmeldingen verzendenSend test notifications

VereistenPrerequisites

  • Azure-abonnement.Azure subscription. Als u nog geen abonnement op Azure hebt, maakt u een gratis Azure-account voordat u begint.If you don't have an Azure subscription, create a free Azure account before you begin.
  • Microsoft Visual Studio 2017 of hoger.Microsoft Visual Studio 2017 or later. In het voorbeelden in deze zelfstudie wordt Visual Studio 2019 gebruikt.The example in this tutorial uses Visual Studio 2019.
  • Ontwikkelhulpprogramma's voor UWP-apps ge├»nstalleerdUWP app-development tools installed
  • Een actief Windows Store-accountAn active Windows Store account
  • Controleer of Meldingen van apps en andere afzenders ontvangen is ingeschakeld.Confirm that Get notifications from apps and other senders setting is enabled.
    • Open het venster Instellingen op de computer.Launch Settings window on your computer.
    • Selecteer de tegel Systeem.Select the System tile.
    • Selecteer Meldingen en acties in het menu aan de linkerkant.Select Notifications & actions from the left menu.
    • Controleer of de instelling Meldingen van apps en andere afzenders ontvangen is ingeschakeld.Confirm that the Get notifications from apps and other senders setting is enabled. Als dat niet het geval is, schakelt u deze in.If it isn't enabled, enable it.

Het voltooien van deze zelfstudie is een vereiste voor alle andere Notification Hubs-zelfstudies voor UWP-apps.Completing this tutorial is a prerequisite for all other Notification Hubs tutorials for UWP apps.

Een app maken in Windows StoreCreate an app in Windows Store

Als u pushmeldingen naar UWP-apps wilt verzenden, koppelt u uw app aan de Windows Store.To send push notifications to UWP apps, associate your app to the Windows Store. Vervolgens configureert u de Notification Hub voor integratie met WNS.Then, configure your notification hub to integrate with WNS.

  1. Navigeer naar het Windows-ontwikkelaarscentrum, meld u aan met uw Microsoft-account en selecteer vervolgens Een nieuwe app maken.Navigate to the Windows Dev Center, sign in with your Microsoft account, and then select Create a new app.

    Knop Nieuwe app

  2. Typ een naam voor uw app en selecteer Productnaam reserveren.Type a name for your app, and then select Reserve product name. Hiermee maakt u een nieuwe Windows Store-registratie voor uw app.Doing so creates a new Windows Store registration for your app.

    Naam van de Store-app

  3. Vouw Productbeheer uit, selecteer WNS/MPNS en vervolgens Live Services-site.Expand Product management, select WNS/MPNS, and then select Live Services site. Meld u aan bij uw Microsoft-account.Sign in to your Microsoft account. De toepassingsregistratiepagina wordt in een nieuw tabblad geopend. U kunt ook rechtstreeks naar de pagina Mijn toepassingen gaan en daar de naam van uw toepassing selecteren om deze pagina te openen.The application registration page opens in a new tab. Alternatively, you can navigate directly to the My applications page, and select your application name to get to this page.

    WNS MPNS-pagina

  4. Noteer het wachtwoord voor Toepassingsgeheimen en zowel de Beveiligings-id (SID) van het pakket als de Toepassings-id onder de sectie Windows Store.Note the Application Secrets password as well as both Package security identifier (SID) and Application Identity under the Windows Store section.

    Waarschuwing

    Het toepassingsgeheim en de pakket-SID zijn belangrijke beveiligingsreferenties.The application secret and package SID are important security credentials. Deel deze waarden met niemand en distribueer ze niet met uw app.Do not share these values with anyone or distribute them with your app.

Een Notification Hub makenCreate a Notification Hub

  1. Meld u aan bij de Azure-portal.Sign in to the Azure portal.

  2. Selecteer Alle services in het menu aan de linkerkant en selecteer Notification Hubs in de sectie Mobiel.Select All services on the left menu, and then select Notification Hubs in the Mobile section. Selecteer het sterpictogram naast de servicenaam om de service toe te voegen aan de sectie FAVORIETEN in het menu aan de linkerkant.Select the star icon next to the service name to add the service to the FAVORITES section on the left menu. Nadat u Notification Hubs hebt toegevoegd aan FAVORIETEN, selecteert u dit in het linkermenu.After you add Notification Hubs to FAVORITES, select it on the left menu.

    Azure Portal - Notification Hubs selecteren

  3. Op de Notification Hubs-pagina selecteert u Toevoegen op de werkbalk.On the Notification Hubs page, select Add on the toolbar.

    Toevoegen van Notification Hubs - knop op de werkbalk

  4. Voer op de pagina Notification Hub de volgende stappen uit:On the Notification Hub page, do the following steps:

    1. Voer een naam in Notification Hub in.Enter a name in Notification Hub.

    2. Voer een naam in Een nieuwe naamruimte maken in.Enter a name in Create a new namespace. Een naamruimte bevat een of meer hubs.A namespace contains one or more hubs.

    3. Selecteer een waarde in de vervolgkeuzelijst Locatie.Select a value from the Location drop-down list box. Deze waarde specificeert de locatie waar u de hub wilt maken.This value specifies the location in which you want to create the hub.

    4. Selecteer een bestaande resourcegroep in Resourcegroep of maak een naam voor een nieuwe resourcegroep.Select an existing resource group in Resource Group, or create a name for a new resource group.

    5. Selecteer Maken.Select Create.

      Azure Portal - eigenschappen van de Notification Hub instellen

  5. Selecteer Meldingen (het belpictogram) en selecteer vervolgens Ga naar resource.Select Notifications (the bell icon), and then select Go to resource. U kunt ook de lijst op de pagina Notification Hubs vernieuwen en uw hub selecteren.You can also refresh the list on the Notification Hubs page and select your hub.

    Azure-portal - naar resource gaan

  6. Selecteer Toegangsbeleid in de lijst.Select Access Policies from the list. U ziet dat de twee verbindingsreeksen voor u beschikbaar zijn.Note that the two connection strings are available to you. Later moet u er pushmeldingen mee afhandelen.You'll need them later to handle push notifications.

    Belangrijk

    Gebruik niet het beleid DefaultFullSharedAccessSignature in uw toepassing.Do not use the DefaultFullSharedAccessSignature policy in your application. Deze mag alleen in uw back-end worden gebruikt.This is meant to be used in your back end only.

    Azure Portal - verbindingsreeksen voor de Notification Hub

WNS-instellingen voor de hub configurerenConfigure WNS settings for the hub

  1. Selecteer in de categorie MELDINGSINSTELLINGEN de optie Windows (WNS) .In the NOTIFICATION SETTINGS category, select Windows (WNS).

  2. Voer waarden in voor pakket-SID en Beveiligingssleutel die u in de vorige sectie hebt genoteerd.Enter values for Package SID and Security Key you noted from the previous section.

  3. Klik op Opslaan op de werkbalk.Click Save on the toolbar.

    De vakken Pakket-SID en Beveiligingssleutel

De Notification Hub is nu geconfigureerd om met WNS te kunnen werken.Your notification hub is now configured to work with WNS. U hebt de verbindingsreeksen om uw app te registreren en meldingen te verzenden.You have the connection strings to register your app and send notifications.

Een voorbeeld-app voor Windows makenCreate a sample Windows app

  1. Open in Visual Studio het menu File en selecteer New en vervolgens Project.In Visual Studio, open the File menu, select New, and then select Project.

  2. Voer in het dialoogvenster Een nieuw project maken de volgende stappen uit:In the Create a new project dialog, complete the following steps:

    1. Typ Windows Universal in het zoekvak bovenaan.In the search box at the top, type Windows Universal.

    2. Selecteer in de zoekresultaten Lege app (Universeel Windows) en selecteer vervolgens Volgende.In the search results, select Blank App (Universal Windows), and then select Next.

      Het dialoogvenster Nieuw project

    3. Voer in het dialoogvenster Uw nieuwe project configureren een projectnaam in en een locatie voor de projectbestanden in.In the Configure your new project dialog, enter a Project name, and a Location for the project files.

    4. Selecteer Maken.Select Create.

  3. Accepteer de standaardwaarden voor het doel en de minimale platformversies en selecteer OK.Accept the defaults for the target and minimum platform versions, and select OK.

  4. Klik in Solution Explorer met de rechtermuisknop op het Windows Store-app-project, selecteer Publiceren en klik vervolgens op App aan de Store koppelen.In Solution Explorer, right-click the Windows Store app project, select Publish, and then select Associate App with the Store. Hierop wordt de wizard Uw app koppelen aan Windows Store weergegeven.The Associate Your App with the Windows Store wizard appears.

  5. Meld u in de wizard aan met uw Microsoft-account.In the wizard, sign in with your Microsoft account.

  6. Selecteer de app die u in stap 2 hebt geregistreerd, selecteer Volgende en selecteer vervolgens koppelen.Select the app that you registered in step 2, select Next, and then select Associate. Hierdoor worden de vereiste registratiegegevens voor Windows Store toegevoegd aan het toepassingsmanifest.Doing so adds the required Windows Store registration information to the application manifest.

  7. Klik met de rechtermuisknop op de oplossing in Visual Studio en selecteer Manage NuGet Packages.In Visual Studio, right-click the solution, and then select Manage NuGet Packages. Het venster Manage NuGet Packages wordt geopend.The Manage NuGet Packages window opens.

  8. Voer in het zoekvak WindowsAzure.Messaging.Managed in, selecteer Install en accepteer de gebruiksvoorwaarden.In the search box, enter WindowsAzure.Messaging.Managed, select Install, and accept the terms of use.

    Het venster NuGet-pakketten beheren

    Met deze actie wordt een verwijzing gedownload, geïnstalleerd en toegevoegd. Deze verwijst naar de Azure Notification Hubs-bibliotheek voor Windows door gebruik te maken van het Microsoft.Azure.NotificationHubs NuGet-pakket.This action downloads, installs, and adds a reference to the Azure Notification Hubs library for Windows by using the Microsoft.Azure.NotificationHubs NuGet package.

  9. Open het projectbestand App.xaml.cs en voeg de volgende instructies toe:Open the App.xaml.cs project file, and add the following statements:

    using Windows.Networking.PushNotifications;
    using Microsoft.WindowsAzure.Messaging;
    using Windows.UI.Popups;
    
  10. Zoek in het bestand App.xaml.cs van het project de klasse App en voeg de volgende InitNotificationsAsync-methodedefinitie toe.In the project's App.xaml.cs file, locate the App class, and add the following InitNotificationsAsync method definition. Vervang <your hub name> door de naam van de Notification Hub die u hebt gemaakt in de Azure-portal, en vervang <Your DefaultListenSharedAccessSignature connection string> door de verbindingsreeks DefaultListenSharedAccessSignature van de pagina Toegangsbeleid van uw Notification Hub:Replace <your hub name> with the name of the notification hub you created in the Azure portal, and replace <Your DefaultListenSharedAccessSignature connection string> with the DefaultListenSharedAccessSignature connection string from the Access Polices page of your notification hub:

    private async void InitNotificationsAsync()
    {
        var channel = await PushNotificationChannelManager.CreatePushNotificationChannelForApplicationAsync();
    
        var hub = new NotificationHub("<your hub name>", "<Your DefaultListenSharedAccessSignature connection string>");
        var result = await hub.RegisterNativeAsync(channel.Uri);
    
        // Displays the registration ID so you know it was successful
        if (result.RegistrationId != null)
        {
            var dialog = new MessageDialog("Registration successful: " + result.RegistrationId);
            dialog.Commands.Add(new UICommand("OK"));
            await dialog.ShowAsync();
        }
    }
    

    Met deze code wordt de kanaal-URI voor de app opgehaald uit WNS en wordt vervolgens die kanaal-URI voor uw Notification Hub geregistreerd.This code retrieves the channel URI for the app from WNS, and then registers that channel URI with your notification hub.

    Notitie

    Vervang de tijdelijke aanduiding hub name door de naam van de Notification Hub die in de Azure-portal wordt weergegeven.Replace the hub name placeholder with the name of the notification hub that appears in the Azure portal. Vervang ook de tijdelijke plaatsaanduiding van de verbindingstekenreeks door de verbindingsreeks DefaultListenSharedAccessSignature die u in een eerdere sectie hebt verkregen op de pagina Toegangsbeleid van uw Notification Hub.Also replace the connection string placeholder with the DefaultListenSharedAccessSignature connection string that you obtained from the Access Polices page of your notification hub in a previous section.

  11. Voeg bovenaan de gebeurtenis-handler OnLaunched in App.xaml.cs de volgende oproep naar de nieuwe methode InitNotificationsAsync toe:At the top of the OnLaunched event handler in App.xaml.cs, add the following call to the new InitNotificationsAsync method:

    InitNotificationsAsync();
    

    Met deze actie wordt gegarandeerd dat de kanaal-URI in uw Notification Hub wordt geregistreerd telkens wanneer de toepassing wordt gestart.This action guarantees that the channel URI is registered in your notification hub each time the application launches.

  12. Klik met de rechtermuisknop op Package.appxmanifest en selecteer Code weergeven (F7).Right-click on Package.appxmanifest and select View Code (F7). Zoek <Identity .../> en vervang de waarde door de Toepassings-id van de WNS die u eerder hebt aangemaakt.Locate <Identity .../> and replace the value with the Application Identity from the WNS you created earlier.

  13. Als u de app wilt uitvoeren, drukt u de toets F5 op het toetsenbord.To run the app, press the keyboard's F5 key. Er wordt een dialoogvenster met de registratiesleutel weergegeven.A dialog box containing the registration key will display. Klik op OK om het dialoogvenster te sluiten.To close the dialog, click OK.

    Registratie voltooid

Uw app is nu gereed om pop-upmeldingen te ontvangen.Your app is now ready to receive toast notifications.

Testmeldingen verzendenSend test notifications

U kunt het ontvangen van meldingen in de app snel testen door meldingen te verzenden in Azure Portal.You can quickly test receiving notifications in your app by sending notifications in the Azure portal.

  1. Ga in de Azure Portal naar het tabblad Overzicht en selecteer Test verzenden op de werkbalk.In the Azure portal, switch to the Overview tab, and select Test Send on the toolbar.

    Knop Verzenden testen

  2. Voer in het venster Test verzenden de volgende acties uit:In the Test Send window, do the following actions:

    1. Selecteer Windows bij Platforms.For Platforms, select Windows.

    2. Selecteer Pop-up bij Meldingstype.For Notification Type, select Toast.

    3. Selecteer Verzenden.Select Send.

      Het venster Verzenden testen

  3. Bekijk het resultaat van de verzendbewerking in de lijst Resultaat onder in het venster.See the result of the Send operation in the Result list at the bottom of the window. U ziet ook een waarschuwingsbericht.You also see an alert message.

    Resultaat van de verzendbewerking

  4. U ziet de melding: Testbericht op het bureaublad.You see the notification message: Test message on your desktop.

    Melding

Volgende stappenNext steps

U hebt meldingen verzonden naar al uw Windows-apparaten via de portal of een console-app.You have sent broadcast notifications to all your Windows devices by using the portal or a console app. Ga verder met de volgende zelfstudie als u wilt weten hoe u pushmeldingen kunt verzenden naar specifieke apparaten:To learn how to push notifications to specific devices, advance to the following tutorial: