Tutorial: Envío de notificaciones a dispositivos concretos que ejecutan aplicaciones de la Plataforma universal de Windows

Nota

El servicio de notificaciones push de Microsoft (MPNS) está en desuso y ya no se admite.

Información general

En este tutorial se explica el uso de Azure Notification Hubs para difundir notificaciones de noticias de última hora. En este tutorial se describen las aplicaciones de la Tienda Windows o Windows Phone 8.1 (que no son de Silverlight). Si el destino es Windows Phone 8.1 Silverlight, consulte Envío de notificaciones push a dispositivos Windows Phone concretos mediante Azure Notification Hubs.

En este tutorial aprenderá a usar Azure Notification Hubs para enviar notificaciones push a dispositivos Windows concretos en los que se ejecuta una aplicación de la Plataforma universal de Windows (UWP). Después de completar el tutorial, puede registrarse en las categorías de noticias de última hora que le interesen. Solo recibirá notificaciones push de esas categorías.

Para habilitar escenarios de difusión, incluya una o varias etiquetas al crear un registro en el centro de notificaciones. Cuando las notificaciones se envían a una etiqueta, todos los dispositivos registrados en ella reciben la notificación. Para más información sobre las etiquetas, consulte Expresiones de etiqueta y enrutamiento.

Nota

Los proyectos de la Tienda Windows y Windows Phone 8.1 y versiones anteriores no se admiten en Visual Studio 2019. Para más información, consulte Compatibilidad y destinatarios de la plataforma de Visual Studio 2019.

En este tutorial se realizan las tareas siguientes:

  • Agregar una selección de categorías a la aplicación móvil
  • Registro de notificaciones
  • Envío de notificaciones con etiquetas
  • Ejecución de la aplicación y generación de notificaciones

Prerrequisitos

Antes de empezar este tutorial complete el tutorial Introducción a Azure Notification Hubs para aplicaciones Windows Phone.

Adición de una selección de categorías a la aplicación

El primer paso consiste en agregar elementos de la interfaz de usuario a la página principal existente de modo que los usuarios puedan seleccionar categorías de registro. Las categorías seleccionadas se almacenan en el dispositivo. Cuando la aplicación se inicia, crea un registro de dispositivos en el centro de notificaciones con las categorías seleccionadas como etiquetas.

  1. Abra el archivo de proyecto MainPage.xaml y copie el siguiente código en el elemento Grid:

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <TextBlock Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2"  TextWrapping="Wrap" Text="Breaking News" FontSize="42" VerticalAlignment="Top" HorizontalAlignment="Center"/>
        <ToggleSwitch Header="World" Name="WorldToggle" Grid.Row="1" Grid.Column="0" HorizontalAlignment="Center"/>
        <ToggleSwitch Header="Politics" Name="PoliticsToggle" Grid.Row="2" Grid.Column="0" HorizontalAlignment="Center"/>
        <ToggleSwitch Header="Business" Name="BusinessToggle" Grid.Row="3" Grid.Column="0" HorizontalAlignment="Center"/>
        <ToggleSwitch Header="Technology" Name="TechnologyToggle" Grid.Row="1" Grid.Column="1" HorizontalAlignment="Center"/>
        <ToggleSwitch Header="Science" Name="ScienceToggle" Grid.Row="2" Grid.Column="1" HorizontalAlignment="Center"/>
        <ToggleSwitch Header="Sports" Name="SportsToggle" Grid.Row="3" Grid.Column="1" HorizontalAlignment="Center"/>
        <Button Name="SubscribeButton" Content="Subscribe" HorizontalAlignment="Center" Grid.Row="4" Grid.Column="0" Grid.ColumnSpan="2" Click="SubscribeButton_Click"/>
    </Grid>
    
  2. En el Explorador de soluciones, haga clic con el botón derecho en el proyecto y seleccione Agregar>Clase. En Agregar nuevo elemento, asígnele a la clase el nombre Notifications y seleccione Agregar. Si es necesario, agregue el modificador public a la definición de la clase.

  3. Agregue las siguientes instrucciones using al archivo nuevo:

    using Windows.Networking.PushNotifications;
    using Microsoft.WindowsAzure.Messaging;
    using Windows.Storage;
    using System.Threading.Tasks;
    
  4. Copie el código siguiente en la clase Notifications nueva:

    private NotificationHub hub;
    
    public Notifications(string hubName, string listenConnectionString)
    {
        hub = new NotificationHub(hubName, listenConnectionString);
    }
    
    public async Task<Registration> StoreCategoriesAndSubscribe(IEnumerable<string> categories)
    {
        ApplicationData.Current.LocalSettings.Values["categories"] = string.Join(",", categories);
        return await SubscribeToCategories(categories);
    }
    
    public IEnumerable<string> RetrieveCategories()
    {
        var categories = (string) ApplicationData.Current.LocalSettings.Values["categories"];
        return categories != null ? categories.Split(','): new string[0];
    }
    
    public async Task<Registration> SubscribeToCategories(IEnumerable<string> categories = null)
    {
        var channel = await PushNotificationChannelManager.CreatePushNotificationChannelForApplicationAsync();
    
        if (categories == null)
        {
            categories = RetrieveCategories();
        }
    
        // Using a template registration to support notifications across platforms.
        // Any template notifications that contain messageParam and a corresponding tag expression
        // will be delivered for this registration.
    
        const string templateBodyWNS = "<toast><visual><binding template=\"ToastText01\"><text id=\"1\">$(messageParam)</text></binding></visual></toast>";
    
        return await hub.RegisterTemplateAsync(channel.Uri, templateBodyWNS, "simpleWNSTemplateExample",
                categories);
    }
    

    Esta clase usa el almacenamiento local para almacenar las categorías de noticias que este dispositivo debe recibir. En lugar de llamar al método RegisterNativeAsync, llame al método RegisterTemplateAsync para registrar las categorías mediante un registro de plantilla.

    Si desea registrar más de una plantilla, especifique un nombre de plantilla, por ejemplo, simpleWNSTemplateExample. Se asigna un nombre a las plantillas para que pueda actualizarlas o eliminarlas. Puede registrar más de una plantilla, por ejemplo, para tener una para las notificaciones del sistema y otra para los iconos.

    Nota

    Con Notification Hubs, un dispositivo puede registrar varias plantillas con la misma etiqueta. En este caso, un mensaje entrante dirigido a esa etiqueta da lugar a que se entreguen varias notificaciones al dispositivo, una por cada plantilla. Este proceso le permite mostrar el mismo mensaje en varias notificaciones visuales, como distintivo y como notificación del sistema en una aplicación de la Tienda Windows.

    Para obtener más información, consulte Plantillas.

  5. En el archivo de proyecto App.xaml.cs, agregue la siguiente propiedad a la clase App:

    public Notifications notifications = new Notifications("<hub name>", "<connection string with listen access>");
    

    Esta propiedad se usa para crear una instancia de Notifications y tener acceso a ella.

    En el código, reemplace los marcadores de posición <hub name> y <connection string with listen access> por el nombre del centro de notificaciones y la cadena de conexión de DefaultListenSharedAccessSignature que obtuvo anteriormente.

    Nota

    Puesto que las credenciales que se distribuyen con una aplicación cliente no son normalmente seguras, distribuya solo la clave para el acceso de escucha con la aplicación cliente. El acceso de escucha permite a la aplicación registrarse en las notificaciones, pero los registros existentes no pueden modificarse y las notificaciones no se pueden enviar. La clave de acceso completo se usa en un servicio back-end protegido para el envío de notificaciones y el cambio de registros existentes.

  6. En el archivo MainPage.xaml.cs, agregue la siguiente línea:

    using Windows.UI.Popups;
    
  7. En el archivo MainPage.xaml.cs, agregue el siguiente método:

    private async void SubscribeButton_Click(object sender, RoutedEventArgs e)
    {
        var categories = new HashSet<string>();
        if (WorldToggle.IsOn) categories.Add("World");
        if (PoliticsToggle.IsOn) categories.Add("Politics");
        if (BusinessToggle.IsOn) categories.Add("Business");
        if (TechnologyToggle.IsOn) categories.Add("Technology");
        if (ScienceToggle.IsOn) categories.Add("Science");
        if (SportsToggle.IsOn) categories.Add("Sports");
    
        var result = await ((App)Application.Current).notifications.StoreCategoriesAndSubscribe(categories);
    
        var dialog = new MessageDialog("Subscribed to: " + string.Join(",", categories) + " on registration Id: " + result.RegistrationId);
        dialog.Commands.Add(new UICommand("OK"));
        await dialog.ShowAsync();
    }
    

    Este método crea una lista de categorías y usa la clase Notifications para almacenar la lista en el almacenamiento local. También registra las etiquetas correspondientes en el centro de notificaciones. Cuando se modifican las categorías, el registro vuelve a crearse con las nuevas categorías.

La aplicación puede almacenar ahora un conjunto de categorías en el almacenamiento local en el dispositivo. La aplicación se registra en el centro de notificaciones siempre que los usuarios cambian la selección de categoría.

Registro de notificaciones

En esta sección, se registrará en el centro de notificaciones al inicio mediante las categorías que ha almacenado en el almacenamiento local.

Nota

Puesto que el URI de canal asignado por el Servicio de notificaciones de Windows (WNS) puede cambiar en cualquier momento, debe registrarse en las notificaciones con frecuencia a fin de evitar errores de notificación. En este ejemplo se registra la notificación cada vez que se inicia la aplicación. En las aplicaciones que se ejecutan con frecuencia (más de una vez al día), es posible que pueda omitir el registro para conservar el ancho de banda si pasa menos de un día desde el registro anterior.

  1. Para usar la clase notifications para suscribirse por categorías, abra el archivo App.xaml.cs y actualice el método InitNotificationsAsync.

    // *** Remove or comment out these lines ***
    //var channel = await PushNotificationChannelManager.CreatePushNotificationChannelForApplicationAsync();
    //var hub = new NotificationHub("your hub name", "your listen connection string");
    //var result = await hub.RegisterNativeAsync(channel.Uri);
    
    var result = await notifications.SubscribeToCategories();
    

    Este proceso garantiza que cuando se inicia la aplicación, recupera las categorías del almacenamiento local. A continuación, solicita el registro de estas categorías. Ha creado el método InitNotificationsAsync como parte del tutorial Envío de notificaciones a aplicaciones de la Plataforma universal de Windows mediante Azure Notification Hubs.

  2. En el archivo de proyecto MainPage.xaml.cs, agregue el siguiente código al método OnNavigatedTo:

    protected override void OnNavigatedTo(NavigationEventArgs e)
    {
        var categories = ((App)Application.Current).notifications.RetrieveCategories();
    
        if (categories.Contains("World")) WorldToggle.IsOn = true;
        if (categories.Contains("Politics")) PoliticsToggle.IsOn = true;
        if (categories.Contains("Business")) BusinessToggle.IsOn = true;
        if (categories.Contains("Technology")) TechnologyToggle.IsOn = true;
        if (categories.Contains("Science")) ScienceToggle.IsOn = true;
        if (categories.Contains("Sports")) SportsToggle.IsOn = true;
    }
    

    Este código actualiza la página principal según el estado de las categorías guardadas anteriormente.

La aplicación ya está completa y puede almacenar un conjunto de categorías en el almacenamiento local del dispositivo. Cuando los usuarios cambian la selección de categoría, las guardadas se utilizan para el registro en el centro de notificaciones. En la siguiente sección, definirá un back-end que puede enviar notificaciones de categoría a esta aplicación.

Ejecución de la aplicación para UWP

  1. En Visual Studio, presione F5 para compilar e iniciar la aplicación. La interfaz de usuario de la aplicación ofrece un conjunto de elementos de alternancia que le permiten seleccionar las categorías a las que suscribirse.

    Aplicación de noticias de última hora

  2. Habilite uno o más elementos de alternancia de categorías y seleccione Suscribirse.

    La aplicación convierte las categorías seleccionadas en etiquetas y solicita un nuevo registro de dispositivo para las etiquetas seleccionadas al Centro de notificaciones. La aplicación muestra las categorías registradas en un cuadro de diálogo.

    Elementos de alternancia de categorías y el botón Suscribirse

Creación de una aplicación de consola para enviar notificaciones con etiquetas

En esta sección se envían noticias de última hora como notificaciones de plantilla con etiquetas desde una aplicación de consola .NET.

  1. En Visual Studio, cree una nueva aplicación de consola en Visual C#:

    1. En el menú, seleccione Archivo>Nuevo>Proyecto.
    2. En Crear un proyecto, seleccione Aplicación de consola (.NET Framework) para C# en la lista de plantillas y seleccione Siguiente.
    3. Escriba un nombre para la aplicación.
    4. En Solución, elija Agregar a solución y seleccione Crear, para crear el proyecto.
  2. Seleccione Herramientas>Administrador de paquetes NuGet>Consola del administrador de paquetes y, en la ventana de la consola, ejecute el siguiente comando:

    Install-Package Microsoft.Azure.NotificationHubs
    

    Esta acción agrega una referencia al SDK de Azure Notification Hubs mediante el paquete Microsoft.Azure.NotificationHubs.

  3. Abra el archivo Program.cs y agregue la siguiente instrucción using:

    using Microsoft.Azure.NotificationHubs;
    
  4. En la clase Program , agregue el siguiente método o reemplácelo si ya existe:

    private static async void SendTemplateNotificationAsync()
    {
        // Define the notification hub.
        NotificationHubClient hub = NotificationHubClient.CreateClientFromConnectionString("<connection string with full access>", "<hub name>");
    
        // Apple requires the apns-push-type header for all requests
        var headers = new Dictionary<string, string> {{"apns-push-type", "alert"}};
    
        // Create an array of breaking news categories.
        var categories = new string[] { "World", "Politics", "Business", "Technology", "Science", "Sports"};
    
        // Send the notification as a template notification. All template registrations that contain
        // "messageParam" and the proper tags will receive the notifications.
        // This includes APNS, GCM/FCM, WNS, and MPNS template registrations.
    
        Dictionary<string, string> templateParams = new Dictionary<string, string>();
    
        foreach (var category in categories)
        {
            templateParams["messageParam"] = "Breaking " + category + " News!";
            await hub.SendTemplateNotificationAsync(templateParams, category);
        }
    }
    

    Este código envía una notificación de plantilla para cada una de las seis etiquetas en la matriz de cadenas. El uso de etiquetas garantiza que los dispositivos reciben notificaciones solo de las categorías registradas.

  5. En el código anterior, reemplace los marcadores de posición <hub name> y <connection string with full access> por el nombre del centro de notificaciones y la cadena de conexión de DefaultFullSharedAccessSignature del panel del centro de notificaciones.

  6. Agregue las siguientes líneas al método Main():

     SendTemplateNotificationAsync();
     Console.ReadLine();
    
  7. Compile la aplicación de consola.

Ejecución de la aplicación de consola para enviar notificaciones con etiquetas

Ejecute la aplicación creada en la sección anterior. Las notificaciones para las categorías seleccionadas aparecen como notificaciones del sistema.

Pasos siguientes

En este tutorial, ha aprendido a difundir noticias de última hora por categoría. La aplicación de back-end inserta notificaciones con etiquetas en los dispositivos que se han registrado para recibir notificaciones de esas etiquetas. Para aprender a enviar notificaciones push a usuarios específicos, con independencia del dispositivo que usen, pase al siguiente tutorial: