Manejo de las notificaciones push en Cordova

Visión general

Antes de que las aplicaciones iOS, Android y Windows Cordova reciban y visualicen notificaciones push, es necesario añadir el plugin Cordova cordova-plugin-mfp-push al proyecto Cordova. Una vez se haya configurado la aplicación, se pueden utilizar la API de notificaciones que MobileFirst proporciona con el propósito de registrar y anular el registro de dispositivos, suscribir y anular la suscripción de etiquetas y manejar aplicaciones. En esta guía de aprendizaje, aprenderá a manejar el envío de notificaciones en aplicaciones Cordova.

Nota: Actualmente en Cordova no se da soporte a las notificaciones autenticadas debido a un defecto. Sin embargo se proporciona un método alternativo: cada llamada de API de MFPPush puede ser acomodada mediante WLAuthorizationManager.obtainAccessToken("push.mobileclient").then( ... );. La aplicación de ejemplo que se proporciona utiliza este método alternativo.

Para obtener información sobre las notificaciones interactivas o silenciosas en iOS, consulte:

• Notificaciones silenciosas
• Notificaciones interactivas

Requisitos previos:

• Asegúrese de haber leído las siguientes guías de aprendizaje:
  • Configuración del entorno de desarrollo de MobileFirst
  • Adición de Mobile Foundation SDK a aplicaciones Cordova
  • Visión general de notificaciones push
• MobileFirst Server para ejecutar localmente, o un remotamente ejecutando MobileFirst Server
• MobileFirst CLI instalado en la estación de trabajo del desarrollador
• Interfaz de línea de mandatos (CLI) de Cordova instalada en la estación de trabajo del desarrollador

Ir a

• Configuración de notificaciones
• API de notificaciones
• Manejo de una notificación push
• Aplicación de ejemplo

Configuración de notificaciones

Cree un nuevo proyecto Cordova o utilice uno ya existente, y añada una o varias de las plataformas soportadas: iOS, Android, Windows.

Si MobileFirst Cordova SDK todavía no está presente en el proyecto, siga las instrucciones en la guía de aprendizaje Adición de Mobile Foundation SDK para aplicaciones Cordova.

Añadir el plugin de push

1. Desde una ventana de línea de mandatos, vaya a la raíz del proyecto Cordova.

2. Añada el plugin ejecutando el mandato:

   cordova plugin add cordova-plugin-mfp-push
   

3. Compile el proyecto Cordova ejecutando el mandato:

   cordova build
   

Plataforma iOS

La plataforma iOS precisa de un paso adicional.
En Xcode, habilite el envío de notificaciones para la aplicación en la pantalla Funcionalidades.

Importante: el bundleId seleccionado para la aplicación debe coincidir con el AppID creado con anterioridad en el sitio de Apple Developer. Consulte la guía de aprendizaje [Visión general de notificaciones push].

Plataforma Android

La plataforma Android precisa de un paso adicional.
En Android Studio, añada la siguiente actividad a la etiqueta application:

<activity android:name="com.ibm.mobilefirstplatform.clientsdk.android.push.api.MFPPushNotificationHandler" android:theme="@android:style/Theme.NoDisplay"/>

API de notificaciones

Lado del cliente

Implementación de API

Inicialización

Inicializa la instancia MFPPush.

• Requerido para la aplicación de cliente para conectarse al servicio MFPPush con el contexto de aplicación correcto.
• Primero se debe llamar al método de la API antes de utilizar cualquier otra API MFPPush.
• Registra la función de retorno de llamada para manejar las notificaciones push recibidas.

MFPPush.initialize (
    function(successResponse) {
        alert("Successfully intialized");
        MFPPush.registerNotificationsCallback(notificationReceived);
    },
    function(failureResponse) {
        alert("Failed to initialize");
    }
);

Está push soportado

Comprueba si el dispositivo da soporte a las notificaciones push.

MFPPush.isPushSupported (
    function(successResponse) {
        alert("Push Supported: " + successResponse);
    },
    function(failureResponse) {
        alert("Failed to get push support status");
    }
);

Registrar el dispositivo

Registre el dispositivo para el servicio de notificaciones push. Si no se proporcionan opciones, se pueden establecer en null.

var options = { };
MFPPush.registerDevice(
    options,
    function(successResponse) {
        alert("Successfully registered");
    },
    function(failureResponse) {
        alert("Failed to register");
    }
);

Obtener etiquetas

Recupere todas las etiquetas disponibles desde el servicio de notificaciones push.

MFPPush.getTags (
    function(tags) {
        alert(JSON.stringify(tags));
},
    function() {
        alert("Failed to get tags");
    }
);

Suscribir

Suscriba las etiquetas deseadas.

var tags = ['sample-tag1','sample-tag2'];

MFPPush.subscribe(
    tags,
    function(tags) {
        alert("Subscribed successfully");
    },
    function() {
        alert("Failed to subscribe");
    }
);

Obtener suscripciones

Recupere las etiquetas a las que el dispositivo está actualmente suscrito.

MFPPush.getSubscriptions (
    function(subscriptions) {
        alert(JSON.stringify(subscriptions));
    },
    function() {
        alert("Failed to get subscriptions");
    }
);

Anular la suscripción

Anule la suscripción de etiquetas.

var tags = ['sample-tag1','sample-tag2'];

MFPPush.unsubscribe(
    tags,
    function(tags) {
        alert("Unsubscribed successfully");
    },
    function() {
        alert("Failed to unsubscribe");
    }
);

Anular el registro

Anule el registro del dispositivo de una instancia de servicio de notificaciones push.

MFPPush.unregisterDevice(
    function(successResponse) {
        alert("Unregistered successfully");
    },
    function() {
        alert("Failed to unregister");
    }
);

Manejar una notificación push

Las notificaciones push recibidas se pueden manejar trabajando con el objeto de respuesta en la función de retorno registrada.

var notificationReceived = function(message) {
    alert(JSON.stringify(message));
};

Aplicación de ejemplo

Pulse para descargar el proyecto Cordova.

Nota: Se necesita instalada la última versión de Google Play Services en el dispositivo Android para poder ejecutar el ejemplo.

Uso de ejemplo

Siga el archivo README.md de ejemplo para obtener instrucciones.