Compartir vía

Envío de notificaciones push seguras desde Azure Notification Hubs

  • Artículo

Información general

La compatibilidad con las notificaciones push en Microsoft Azure le permite tener acceso a una infraestructura multiplataforma y de escalamiento horizontal fácil de usar, que simplifica considerablemente la implementación de notificaciones push tanto en aplicaciones de consumidor como en aplicaciones empresariales para plataformas móviles.

Debido a restricciones reguladoras o de seguridad, algunas veces una aplicación podría querer incluir algo en la notificación que no se puede trasmitir a través de la infraestructura de las notificaciones de inserción estándar. En este tutorial se describe cómo lograr la misma experiencia enviando información importante a través de una conexión segura y autenticada entre el dispositivo cliente y el back-end de la aplicación.

A un alto nivel, el flujo es el siguiente:

  1. El back-end de la aplicación:
    • Almacena la carga segura en la base de datos back-end.
    • Envía el identificador de esta notificación al dispositivo (no se envía información segura).
  2. La aplicación del dispositivo, cuando recibe la información:
    • El dispositivo entra en contacto con el back-end que solicita la carga segura.
    • La aplicación puede mostrar la carga como una notificación en el dispositivo.

Es importante tener en cuenta que en el flujo anterior (y en este tutorial), asumimos que el dispositivo almacena un token de autenticación localmente y, después, el usuario inicia sesión. Esto garantiza una experiencia sin ningún problema, ya que el dispositivo puede recuperar la carga segura de la notificación usando este token. Si la aplicación no almacena tokens de autenticación en el dispositivo, o si estos tokens han expirado, la aplicación del dispositivo, al recibir la notificación, debe mostrar una notificación genérica pidiendo al usuario que inicie la aplicación. Después, la aplicación autentica al usuario y muestra la carga de la notificación.

En este tutorial se muestra cómo enviar una notificación push de forma segura. Se basa en el tutorial Notificación a los usuarios, por lo que primero debe completar los pasos de ese tutorial.

Nota:

En este tutorial se supone que ha creado y configurado el centro de notificaciones tal como se describe en Envío de notificaciones a aplicaciones de la Plataforma universal de Windows. Asimismo, tenga en cuenta que Windows Phone 8.1 requiere credenciales de Windows (no de Windows Phone) y que las tareas en segundo plano no funcionan en Windows Phone 8.0 o Silverlight 8.1. Para aplicaciones de la Tienda Windows, puede recibir notificaciones a través de una tarea en segundo plano solamente si la aplicación tiene la pantalla de bloqueo habilitada (haga clic en la casilla en el manifiesto de la aplicación).

Proyecto WebAPI

  1. En Visual Studio, abra el proyecto AppBackend que creó en el tutorial Notificación a usuarios .

  2. En Notifications.cs, reemplace toda la clase Notifications por el código siguiente. Asegúrese de sustituir los marcadores de posición por su cadena de conexión (con acceso total) para el Centro de notificaciones y el nombre del centro. Puede obtener estos valores en Azure Portal. Este módulo representa ahora las diferentes notificaciones seguras que se enviarán. En una implementación completa, las notificaciones se almacenarán en una base de datos; en este caso, vamos a almacenarlas en la memoria para simplificar el proceso.

     public class Notification
 {
     public int Id { get; set; }
     public string Payload { get; set; }
     public bool Read { get; set; }
 }

 public class Notifications
 {
     public static Notifications Instance = new Notifications();

     private List<Notification> notifications = new List<Notification>();

     public NotificationHubClient Hub { get; set; }

     private Notifications() {
         Hub = NotificationHubClient.CreateClientFromConnectionString("{conn string with full access}",     "{hub name}");
     }

     public Notification CreateNotification(string payload)
     {
         var notification = new Notification() {
         Id = notifications.Count,
         Payload = payload,
         Read = false
         };

         notifications.Add(notification);

         return notification;
     }

     public Notification ReadNotification(int id)
     {
         return notifications.ElementAt(id);
     }
 }

  3. En NotificationsController.cs, reemplace el código dentro de la definición de clase NotificationsController por el código siguiente. Este componente dota al dispositivo de una ruta para recuperar la notificación de forma segura, y además ofrece una manera (para los fines de este tutorial) de desencadenar una inserción segura en sus dispositivos. Tenga en cuenta que al enviar la notificación al Centro de notificaciones, enviamos una notificación sin procesar solo con el identificador de la notificación (no el mensaje real):

     public NotificationsController()
 {
     Notifications.Instance.CreateNotification("This is a secure notification!");
 }

 // GET api/notifications/id
 public Notification Get(int id)
 {
     return Notifications.Instance.ReadNotification(id);
 }

 public async Task<HttpResponseMessage> Post()
 {
     var secureNotificationInTheBackend = Notifications.Instance.CreateNotification("Secure confirmation.");
     var usernameTag = "username:" + HttpContext.Current.User.Identity.Name;

     // windows
     var rawNotificationToBeSent = new Microsoft.Azure.NotificationHubs.WindowsNotification(secureNotificationInTheBackend.Id.ToString(),
                     new Dictionary<string, string> {
                         {"X-WNS-Type", "wns/raw"}
                     });
     await Notifications.Instance.Hub.SendNotificationAsync(rawNotificationToBeSent, usernameTag);

     // apns
     await Notifications.Instance.Hub.SendAppleNativeNotificationAsync("{\"aps\": {\"content-available\": 1}, \"secureId\": \"" + secureNotificationInTheBackend.Id.ToString() + "\"}", usernameTag);

     // gcm
     await Notifications.Instance.Hub.SendGcmNativeNotificationAsync("{\"data\": {\"secureId\": \"" + secureNotificationInTheBackend.Id.ToString() + "\"}}", usernameTag);

     return Request.CreateResponse(HttpStatusCode.OK);
 }

Tenga en cuenta que el método Post ahora no envía una notificación del sistema. Envía una notificación sin procesar que contiene solo el identificador de la notificación sin ningún tipo de contenido delicado. Además, asegúrese de comentar la operación de envío de las plataformas para las que no tiene credenciales configuradas en su Centro de notificaciones, ya que provocarán un error.

  1. Ahora implementaremos de nuevo esta aplicación en un sitio web de Azure a fin de que sea accesible para todos los dispositivos. Haga clic con el botón derecho en el proyecto AppBackend y, a continuación, seleccione Publicar.
  2. Seleccione Sitio web Azure como destino de publicación. Inicie sesión con su cuenta de Azure, seleccione un sitio web nuevo o existente y anote la propiedad Dirección URL de destino en la pestaña Conexión. Más tarde en este tutorial haremos referencia a esta dirección URL como extremo de backend . Haga clic en Publicar.

Modificación del proyecto de Windows Phone

  1. En el proyecto NotifyUserWindowsPhone , agregue el siguiente código a App.xaml.cs para registrar la tarea de segundo plano de inserción. Agregue la siguiente línea de código al final del método OnLaunched() :

    RegisterBackgroundTask();

  2. Todavía en App.xaml.cs, agregue el siguiente código inmediatamente después del método OnLaunched() :

    private async void RegisterBackgroundTask()
{
    if (!Windows.ApplicationModel.Background.BackgroundTaskRegistration.AllTasks.Any(i => i.Value.Name == "PushBackgroundTask"))
    {
        var result = await BackgroundExecutionManager.RequestAccessAsync();
        var builder = new BackgroundTaskBuilder();

        builder.Name = "PushBackgroundTask";
        builder.TaskEntryPoint = typeof(PushBackgroundComponent.PushBackgroundTask).FullName;
        builder.SetTrigger(new Windows.ApplicationModel.Background.PushNotificationTrigger());
        BackgroundTaskRegistration task = builder.Register();
    }
}

  3. Agregue las siguientes instrucciones using en la parte superior del archivo App.xaml.cs:

    using Windows.Networking.PushNotifications;
using Windows.ApplicationModel.Background;

  4. En el menú Archivo de Visual Studio, haga clic en Guardar todo.

Creación del componente de segundo plano de inserción

El paso siguiente es crear el componente de segundo plano de inserción.

  1. En el Explorador de soluciones, haga clic con el botón derecho en el nodo de nivel superior de la solución (en este caso, Solución SecurePush), haga clic en Agregar y, después, haga clic en Nuevo proyecto.

  2. Expanda Aplicaciones de la Tienda, haga clic en Aplicaciones de Windows Phone y, después, en Componente de Windows Runtime (Windows Phone) . Asigne al proyecto el nombre PushBackgroundComponent y, después, haga clic en Aceptar para crear el proyecto.

    Captura de pantalla del cuadro de diálogo Agregar nuevo proyecto con la opción de Visual C# Componente de Windows Runtime (Windows Phone) resaltada.

  3. En el Explorador de soluciones, haga clic con el botón derecho en el proyecto PushBackgroundComponent (Windows Phone 8.1) , haga clic en Agregar y, después, en Clase. Asigne el nombre PushBackgroundTask.cs a la nueva clase. Haga clic en Agregar para generar la clase.

  4. Reemplace todo el contenido de la definición del espacio de nombres PushBackgroundComponent por el código siguiente, reemplazando el marcador de posición {back-end endpoint} por el punto de conexión de back-end obtenido al implementar el back-end:

    public sealed class Notification
    {
        public int Id { get; set; }
        public string Payload { get; set; }
        public bool Read { get; set; }
    }

    public sealed class PushBackgroundTask : IBackgroundTask
    {
        private string GET_URL = "{back-end endpoint}/api/notifications/";

        async void IBackgroundTask.Run(IBackgroundTaskInstance taskInstance)
        {
            // Store the content received from the notification so it can be retrieved from the UI.
            RawNotification raw = (RawNotification)taskInstance.TriggerDetails;
            var notificationId = raw.Content;

            // retrieve content
            BackgroundTaskDeferral deferral = taskInstance.GetDeferral();
            var httpClient = new HttpClient();
            var settings = ApplicationData.Current.LocalSettings.Values;
            httpClient.DefaultRequestHeaders.Authorization = new AuthenticationHeaderValue("Basic", (string)settings["AuthenticationToken"]);

            var notificationString = await httpClient.GetStringAsync(GET_URL + notificationId);

            var notification = JsonConvert.DeserializeObject<Notification>(notificationString);

            ShowToast(notification);

            deferral.Complete();
        }

        private void ShowToast(Notification notification)
        {
            ToastTemplateType toastTemplate = ToastTemplateType.ToastText01;
            XmlDocument toastXml = ToastNotificationManager.GetTemplateContent(toastTemplate);
            XmlNodeList toastTextElements = toastXml.GetElementsByTagName("text");
            toastTextElements[0].AppendChild(toastXml.CreateTextNode(notification.Payload));
            ToastNotification toast = new ToastNotification(toastXml);
            ToastNotificationManager.CreateToastNotifier().Show(toast);
        }
    }

  5. En el Explorador de soluciones, haga clic con el botón derecho en el proyecto PushBackgroundComponent (Windows Phone 8.1) y, después, seleccione Administrar paquetes de NuGet.

  6. A la izquierda, haga clic en En línea.

  7. En el cuadro Buscar, escriba Cliente http.

  8. En la lista de resultados, haga clic en Bibliotecas de cliente HTTP de Microsoft y, a continuación, haga clic en Instalar. Complete la instalación.

  9. Nuevamente en el cuadro Buscar de NuGet, escriba Json.net. Instale el paquete Json.NET y cierre la ventana Administrador de paquetes de NuGet.

  10. Agregue las siguientes instrucciones using al principio del archivo PushBackgroundTask.cs:

    using Windows.ApplicationModel.Background;
using Windows.Networking.PushNotifications;
using System.Net.Http;
using Windows.Storage;
using System.Net.Http.Headers;
using Newtonsoft.Json;
using Windows.UI.Notifications;
using Windows.Data.Xml.Dom;

  11. En el Explorador de soluciones, en el proyecto NotifyUserWindowsPhone (Windows Phone 8.1) , haga clic con el botón derecho en Referencias y, después, haga clic en Agregar referencia… En el diálogo Administrador de referencias, active la casilla junto a PushBackgroundComponent y, después, haga clic en Aceptar.

  12. En el Explorador de soluciones, haga doble clic en Package.appxmanifest en el proyecto NotifyUserWindowsPhone (Windows Phone 8.1) . En Notificaciones, establezca la opción Capacidad de aviso en Sí.

    Captura de pantalla de la ventana Explorador de soluciones con el archivo Package.appxmanifest resaltado con la opción Capacidad de aviso establecida en Sí enmarcada en rojo.

  13. Sin salir de Package.appxmanifest, haga clic en el menú Declaraciones cerca de la parte superior. En el cuadro desplegable Declaraciones disponibles, haga clic en Tareas en segundo plano y, después, en Agregar.

  14. En Package.appxmanifest, en Propiedades, active Notificación de inserción.

  15. En Package.appxmanifest, en Configuración de la aplicación, escriba PushBackgroundComponent.PushBackgroundTask en el campo Punto de entrada.

    Captura de pantalla de la ventana Explorador de soluciones con el archivo Package.appxmanifest resaltado y las opciones Declaraciones disponibles, Declaraciones admitidas, Notificaciones de inserción y Punto de entrada enmarcadas en rojo.

  16. En el menú Archivo, haga clic en Guardar todo.

Ejecución de la aplicación

Para ejecutar la aplicación, realice las siguientes tareas:

  1. En Visual Studio, ejecute la aplicación Web API AppBackend . Se mostrará una página web ASP.NET.
  2. En Visual Studio, ejecute la aplicación de Windows Phone NotifyUserWindowsPhone (Windows Phone 8.1) . El emulador de Windows Phone se ejecuta y carga la aplicación automáticamente.
  3. En la interfaz de usuario de la aplicación NotifyUserWindowsPhone , escriba un nombre de usuario y contraseña. Esta información puede ser cualquier cadena, pero deben tener el mismo valor.
  4. En la interfaz de usuario de la aplicación NotifyUserWindowsPhone, haga clic en Iniciar sesión y registrarse. A continuación, haga clic en Enviar inserción.