Incorporación de notificaciones push a la aplicación de Android

  • Artículo

Información general

En este tutorial, agregará notificaciones de inserción al proyecto de inicio rápido de Android para que cada vez que se envíe una notificación de inserción al dispositivo, se inserte un registro.

Si no usa el proyecto de servidor de inicio rápido descargado, necesita el paquete de extensión de la notificación de inserción. Para más información, vea Trabajar con el SDK de servidor de back-end de .NET para Azure Mobile Apps.

Prerrequisitos

Necesita lo siguiente:

  • Un IDE que depende del back-end del proyecto:

  • Android 2.3 o posterior y revisión de Google Repository 27 o superior, Google Play Services 9.0.2 o superior para Firebase Cloud Messaging

  • Completar el inicio rápido de Android.

Creación de un proyecto que admita Firebase Cloud Messaging

  1. Inicie sesión en la consola Firebase. Si aún no tiene uno, cree un nuevo proyecto de Firebase.

  2. Después de crear el proyecto, seleccione Add Firebase to your Android app (Añade Firebase a tu aplicación de Android).

    Agregar Firebase a una aplicación de Android

  3. En la página Add Firebase to your Android app (Agregar Firebase a la aplicación Android), haga lo siguiente:

    1. En Nombre del paquete de Android, copie el valor de su applicationId en el archivo build.gradle de la aplicación. En este ejemplo, es com.fabrikam.fcmtutorial1app.

      Especifique el nombre del paquete.

    2. Seleccione Registrar aplicación.

  4. Seleccione Descargar google-services.json, guarde el archivo en la carpeta app del proyecto y, a continuación, seleccione Siguiente.

    Descargue el archivo google-services.json.

  5. Haga que los siguientes cambios de configuración en el proyecto en Android Studio.

    1. En el archivoproject-level build.gradle (<project>/build.gradle), agregue la siguiente instrucción a la sección de dependencias.

      classpath 'com.google.gms:google-services:4.0.1'

    2. En el archivo build.gradle de nivel de aplicación (<project>/<app-module>/build.gradle), agregue las siguientes instrucciones a la sección de dependencias.

      implementation 'com.google.firebase:firebase-core:16.0.8'
implementation 'com.google.firebase:firebase-messaging:17.3.4'

    3. Agregue la siguiente línea al final del archivo app-level build.gradle después de la sección de dependencias.

      apply plugin: 'com.google.gms.google-services'

    4. Seleccione Sinc Now (Sincronizar ahora) en la barra de herramientas.

      cambios de configuración de build.gradle

  6. Seleccione Next (Siguiente).

  7. Seleccione Skip this step (Omitir este paso).

    Omita el último paso.

  8. En la consola Firebase, seleccione el icono de la rueda dentada del proyecto. Luego, seleccione Project Settings (Configuración del proyecto).

    Seleccionar Project Settings (Configuración del proyecto)

  9. Si aún no ha descargado el archivo google-services.json en la carpeta app del proyecto de Android Studio, puede hacerlo en esta página.

  10. Cambie a la pestaña Cloud Messaging de la parte superior.

  11. Copie y guarde la clave del servidor para su uso posterior. Usará este valor para configurar el concentrador.

Configuración de un Centro de notificaciones

La característica Mobile Apps de Azure App Service usa Azure Notification Hubs para enviar notificaciones push; por lo tanto, necesita un centro de notificaciones para su aplicación móvil.

  1. En Azure Portal, vaya a App Services y seleccione el back-end de la aplicación. En Configuración, seleccione Insertar.

  2. Seleccione Conectar para agregar un recurso de Centro de notificaciones a la aplicación. Puede crear un centro o conectarse a uno existente.

    Configurar un centro

Ya ha conectado un centro de notificaciones al proyecto de back-end de Mobile Apps. Más adelante configure este centro de notificaciones para que se conecte a un sistema de notificación de plataforma (PNS) que envíe notificaciones push a los dispositivos.

Configuración de Azure para enviar notificaciones push

  1. En Azure Portal, haga clic en Examinar todo>App Services y finalmente en el back-end de Mobile Apps. En Configuración, haga clic en App Service Push y, después, en el nombre del centro de notificaciones.

  2. Vaya a Google (GCM), escriba el valor de Clave de servidor que obtuvo de Firebase en el procedimiento anterior y, después, haga clic en Guardar.

    Establezca la clave de API en el portal

El back-end de Mobile Apps ahora está configurado para usar Firebase Cloud Messaging. Esto permite enviar notificaciones push a la aplicación que se ejecuta en un dispositivo Android mediante el centro de notificaciones.

Habilitar las notificaciones de inserción para el proyecto de servidor

Use el procedimiento que coincida con el tipo de proyecto back-end, ya sea back-end de .NET o Node.js back-end.

Proyecto de back-end de .NET

  1. En Visual Studio, haga clic con el botón derecho en el proyecto de servidor, haga clic en Administrar paquetes NuGet. Busque Microsoft.Azure.NotificationHubs y, después, haga clic en Instalar. Esto instala la biblioteca de cliente de Notification Hubs.

  2. En la carpeta Controladores, abra TodoItemController.cs y agregue las siguientes instrucciones using :

    using Microsoft.Azure.Mobile.Server.Config;
using Microsoft.Azure.NotificationHubs;

  3. Reemplace el método PostTodoItem con el código siguiente:

    public async Task<IHttpActionResult> PostTodoItem(TodoItem item)
{
    TodoItem current = await InsertAsync(item);
    // Get the settings for the server project.
    HttpConfiguration config = this.Configuration;

    MobileAppSettingsDictionary settings =
        this.Configuration.GetMobileAppSettingsProvider().GetMobileAppSettings();

    // Get the Notification Hubs credentials for the Mobile App.
    string notificationHubName = settings.NotificationHubName;
    string notificationHubConnection = settings
        .Connections[MobileAppSettingsKeys.NotificationHubConnectionString].ConnectionString;

    // Create a new Notification Hub client.
    NotificationHubClient hub = NotificationHubClient
    .CreateClientFromConnectionString(notificationHubConnection, notificationHubName);

    // Android payload
    var androidNotificationPayload = "{ \"data\" : {\"message\":\"" + item.Text + "\"}}";

    try
    {
        // Send the push notification and log the results.
        var result = await hub.SendGcmNativeNotificationAsync(androidNotificationPayload);

        // Write the success result to the logs.
        config.Services.GetTraceWriter().Info(result.State.ToString());
    }
    catch (System.Exception ex)
    {
        // Write the failure result to the logs.
        config.Services.GetTraceWriter()
            .Error(ex.Message, null, "Push.SendAsync Error");
    }
    return CreatedAtRoute("Tables", new { id = current.Id }, current);
}

  4. Vuelva a publicar el proyecto de servidor.

Proyecto de back-end de Node.js

  1. Configure el proyecto de back-end.

  2. Reemplace el código existente en el archivo todoitem.js por lo siguiente:

    var azureMobileApps = require('azure-mobile-apps'),
promises = require('azure-mobile-apps/src/utilities/promises'),
logger = require('azure-mobile-apps/src/logger');

var table = azureMobileApps.table();

table.insert(function (context) {
// For more information about the Notification Hubs JavaScript SDK,
// see https://aka.ms/nodejshubs
logger.info('Running TodoItem.insert');

// Define the GCM payload.
var payload = {
    "data": {
        "message": context.item.text
    }
};

// Execute the insert.  The insert returns the results as a Promise,
// Do the push as a post-execute action within the promise flow.
return context.execute()
    .then(function (results) {
        // Only do the push if configured
        if (context.push) {
            // Send a GCM native notification.
            context.push.gcm.send(null, payload, function (error) {
                if (error) {
                    logger.error('Error while sending push notification: ', error);
                } else {
                    logger.info('Push notification sent successfully!');
                }
            });
        }
        // Don't forget to return the results from the context.execute()
        return results;
    })
    .catch(function (error) {
        logger.error('Error while running context.execute: ', error);
    });
});

module.exports = table;

    Esta acción envía una notificación de GCM que contiene el item.text cuando se inserta un nuevo elemento todo.

  3. Cuando edite el archivo en el equipo local, vuelva a publicar el proyecto de servidor.

Incorporación de notificaciones de inserción a la aplicación

En esta sección, se actualiza la aplicación Android de cliente para controlar las notificaciones de inserción.

Comprobación de la versión del SDK de Android

Debido al desarrollo en curso, puede que la versión del SDK de Android instalada no coincida con la versión del código. La versión de Android SDK a la que se hace referencia en este tutorial es la 26, la última en el momento de la escritura. El número de versión puede aumentar a medida que aparezcan nuevas versiones del SDK, de modo que se recomienda usar la última versión disponible.

Dos síntomas de error de coincidencia de la versión son los siguientes:

  • Al compilar o volver a compilar el proyecto, puede obtener mensajes de error de Gradle como Gradle sync failed: Failed to find target with hash string 'android-XX'.
  • Los objetos de Android estándar del código que deben resolverse según las instrucciones import pueden generar mensajes de error.

Si aparece cualquiera de estos mensajes, es posible que la versión del SDK de Android instalada en Android Studio no coincida con el destino del SDK del proyecto descargado. Para comprobar la versión, realice los siguientes cambios:

  1. En Android Studio, haga clic en Herramientas android>>SDK Manager. Si no ha instalado la última versión de la plataforma de SDK, haga clic para instalarla. Anote el número de versión.

  2. En la pestaña Explorador de proyectos, en Scripts de Gradle, abra el archivo build.gradle (Module: app). Asegúrese de que compileSdkVersion y targetSdkVersion se establecen en la versión más reciente del SDK instalada. Es posible que build.gradle tenga este aspecto:

    android {
    compileSdkVersion 26
    defaultConfig {
        targetSdkVersion 26
    }
}

El siguiente paso es instalar los servicios de Google Play. Firebase Cloud Messaging tiene algunos requisitos mínimos en el nivel de API para desarrollo y prueba, que debe cumplir la propiedad minSdkVersion del manifiesto.

Si va a realizar pruebas con un dispositivo antiguo, consulte Agregue Firebase a su proyecto de Android para determinar el valor mínimo que puede configurar y cómo configurarlo de forma adecuada.

Agregar Firebase Cloud Messaging al proyecto

  1. Incorporación de Firebase al proyecto de Android

  2. En Android Studio, elijaEstructura del proyecto dearchivo>. Seleccione Notificaciones, seleccione Firebase Cloud Messaging y, después, haga clic en Aceptar.

Incorporación de código

  1. En su proyecto de aplicación, abra el archivo AndroidManifest.xml. Agregue el siguiente código después de la etiqueta de apertura application :

    <service android:name=".ToDoMessagingService">
    <intent-filter>
        <action android:name="com.google.firebase.MESSAGING_EVENT"/>
    </intent-filter>
</service>
<service android:name=".ToDoInstanceIdService">
    <intent-filter>
        <action android:name="com.google.firebase.INSTANCE_ID_EVENT"/>
    </intent-filter>
</service>

  2. Abra el archivo ToDoActivity.java y realice los siguientes cambios:

    • Agregue la instrucción import:

      import com.google.firebase.iid.FirebaseInstanceId;

    • Cambie la definición de MobileServiceClient de privado a público estático; ahora tendrá el siguiente aspecto:

      private static MobileServiceClient mClient;

    • Agregue el método registerPush:

      public static void registerPush() {
    final String token = FirebaseInstanceId.getInstance().getToken();
    if (token != null) {
        new AsyncTask<Void, Void, Void>() {
            protected Void doInBackground(Void... params) {
                mClient.getPush().register(token);
                return null;
            }
        }.execute();
    }
}

    • Actualice el método onCreate de la clase ToDoActivity. Asegúrese de agregar este código después de crear una instancia de MobileServiceClient.

      registerPush();

  3. Agregue una nueva clase para controlar las notificaciones. En el Explorador de proyectos, abra la aplicación>java>los nodos del espacio de nombres del proyecto y haga clic con el botón derecho en el nodo de nombre del paquete. Haga clic en Nuevo y en Clase Java. En Nombre escriba ToDoMessagingService y, después, haga clic en Aceptar. A continuación, reemplace la declaración de clase por:

    import android.app.Notification;
import android.app.NotificationManager;
import android.app.PendingIntent;
import android.content.Context;
import android.content.Intent;

import com.google.firebase.messaging.FirebaseMessagingService;
import com.google.firebase.messaging.RemoteMessage;

public class ToDoMessagingService extends FirebaseMessagingService {

    private static final int NOTIFICATION_ID = 1;

    @Override
    public void onMessageReceived(RemoteMessage remoteMessage) {
        String message = remoteMessage.getData().get("message");
        if (message != null) {
            sendNotification("Notification Hub Demo", message);
        }
    }

    private void sendNotification(String title, String messageBody) {
        PendingIntent contentIntent = PendingIntent.getActivity(this, 0, new Intent(this, ToDoActivity.class), 0);
        Notification.Builder notificationBuilder = new Notification.Builder(this)
                .setSmallIcon(R.drawable.ic_launcher)
                .setContentTitle(title)
                .setContentText(messageBody)
                .setContentIntent(contentIntent);
        NotificationManager notificationManager = (NotificationManager) getSystemService(Context.NOTIFICATION_SERVICE);
        if (notificationManager != null) {
            notificationManager.notify(NOTIFICATION_ID, notificationBuilder.build());
        }
    }
}

  4. Agregue otra clase para controlar las actualizaciones del token. Cree la clase Java ToDoInstanceIdService y reemplace la declaración de clase por:

    import com.google.firebase.iid.FirebaseInstanceIdService;

public class ToDoInstanceIdService extends FirebaseInstanceIdService {

    @Override
    public void onTokenRefresh() {
        ToDoActivity.registerPush();
    }
}

Ahora su aplicación está actualizada para que sea compatible con las notificaciones push.

Prueba de la aplicación con el servicio móvil publicado

Puede probar la aplicación conectando directamente un teléfono Android con un cable USB o utilizando un dispositivo virtual en el emulador.

Pasos siguientes

Ahora que ha completado este tutorial, considere la posibilidad de continuar con uno de los siguientes tutoriales: