Saltar a contenido

Notificaciones Push

¿Que son las notificaciones Push?

Las notificaciones push son mensajes enviados desde una aplicación móvil a los dispositivos de los usuarios, con el objetivo de comunicar información importante, actualizaciones o eventos relevantes. Estas notificaciones pueden incluir texto, imágenes, enlaces y otros elementos multimedia, y son entregadas de manera instantánea, lo que permite una comunicación directa y efectiva con los usuarios, sin importar su ubicación o actividad dentro de la aplicación.

Diferencias entre proveedores

PROVEEDORES FCM Notification Hub One Signal
COSTO El servicio de Firebase Cloud Messaging es gratis y sin costo ilimitado. No cobra por la cantidad de notificaciones enviadas ni dispositivos subscriptos pero si por almacenamiento en caso de necesitar subir una imagen o archivo en la notificación, en tal caso habria que revisar los precios de cloud storage. mas detalle Cuenta con tres planes: El limite principal de cobro es por cantidad de envios de notificaciones y dispositivos vinculados. Free se obtiene hasta un millon de envios free y 500 dispositivos activos. Básico cuenta con 10 millones de envios y 200000 dispositivos activos con cobro adicional por cada 10millones de envios excedidos. Standar 10 millones de envios y 10 millones de dispositivos activos con cobro adicional por cada 10 a 100 millones de envios adicionales o mas de 100 millones. mas detalle Cuenta con 4 planes. El plan free cuenta con envio de notificaciones push ilimitados y A/B Testing sin embargo, el resto de los planes aumenta la seguridad, personalizacion y manejo de reportes. mas detalle
IMPLEMENTACION Se usa unicamente con FCM, es la misma para iOS y Android Para iOS usa APNS y para Android FCM. Para cada plataforma se debe implementar de manera diferente Al igual que notificación hubs implementa APNS para iOS y FCM para Android.
USO Notificaciones Push, Crash report, A/B Testing Se utiliza únicamente para notificaciones Push Es utilizado para notificaciones push, envío de mails, envío de SMS, A/B Testing, Reporting
COMUNIDAD Muy popular, respaldado por la plataforma Firebase de Google. Ampliamente adoptado en el desarrollo de aplicaciones móviles Menos común en comparación con One Signal y FCM, pero cuenta con una base de usuarios sólida. Ampliamente utilizado, especialmente en aplicaciones móviles y sitios web. Gran base de usuarios.
DOCUMENTACION Documentación extensa proporcionada por Google. Soporte sólido con muchos recursos en línea. Documentación detallada, pero puede ser menos extensa que la de One Signal y FCM Documentación completa y accesible. Amplia base de conocimientos y tutoriales en línea.

Firebase Cloud Messages

Firebase Cloud Messaging (FCM) es un servicio de mensajería en la nube desarrollado por Google como parte de la plataforma Firebase. Este servicio permite a los desarrolladores enviar notificaciones push y mensajes a dispositivos móviles, así como a navegadores web y otros dispositivos conectados.

FCM ofrece una solución integral para la implementación de notificaciones push en aplicaciones móviles y web. Permite a los desarrolladores enviar mensajes a dispositivos individuales, grupos de dispositivos o segmentos específicos de usuarios, lo que permite una personalización precisa y una comunicación efectiva.

Entre las características destacadas de Firebase Cloud Messaging se incluyen:

  • Entrega confiable: FCM garantiza la entrega confiable de mensajes a dispositivos incluso en condiciones de red adversas, utilizando un protocolo de entrega optimizado y una infraestructura global de servidores.

  • Segmentación de usuarios: Los desarrolladores pueden segmentar a los usuarios en grupos específicos según diversos criterios, como la ubicación geográfica, las preferencias de usuario o el comportamiento dentro de la aplicación, lo que permite una personalización precisa de las notificaciones.

  • Notificaciones enriquecidas: FCM admite notificaciones enriquecidas que pueden incluir texto, imágenes, enlaces y otros elementos multimedia, lo que permite a los desarrolladores crear experiencias de usuario atractivas y llamativas.

  • Analíticas integradas: Firebase Analytics proporciona análisis integrados sobre la efectividad de las notificaciones push, lo que permite a los desarrolladores medir el impacto de sus campañas y optimizar su estrategia de comunicación.

Arquitectura FCM

arqFCM

  1. Se crea la solicitud de mensaje en un entorno compatible con los protocolos FCM o con el SDK Admin. FCM brinda una Interfaz de usuario Grafica para dicho fin.
  2. El backend de FCM, acepta las solicitudes de mensajes, realiza la distribución a través de diferentes Topicos.
  3. Los mensajes ingresan en la capa de transporte, segun la plataforma de los dispositivos (android, iOS, web) y se aseguran que los mensajes se entreguen.
  4. El sdk configurado en la aplicacion de dispositivo, maneja la recepcion del mensaje.

Desarrollo - PoC

En esta sección, exploraremos los pasos necesarios para llevar a cabo una prueba de concepto (PoC) sobre la implementación de notificaciones push utilizando Firebase Cloud Messaging (FCM). A lo largo de este proceso, se detallará cómo configurar y utilizar FCM dentro del contexto de una aplicación móvil, desde la configuración inicial hasta el envío de notificaciones push a dispositivos móviles. Este recorrido proporcionará una guía paso a paso que permitirá demostrar su funcionalidad en una prueba de concepto.

Repositorio

Puede ver la PoC en arquitectura mobile

Pre requisitos

  1. Crear un proyecto en Firebase

Instalación:

Utilizaremos la libreria React Native Firebase, la cual es oficialmente recomendada y brinda soporte de React Native para todos los servicios de Firebase en aplicaciones de Android e iOS.

# to configuration
yarn add @react-native-firebase/app 

# to subscription to events
yarn add @react-native-firebase/message

# to display notification
yarn add @notifee/react-native

Configuración

  1. Sumar en android/app/build.gradle
build.gradle
...
apply plugin: "com.google.gms.google-services"

...

dependencies {

...

    // TODO: Add the dependencies for Firebase products you want to use
    implementation("com.google.firebase:firebase-analytics")

    implementation(platform("com.google.firebase:firebase-bom:32.7.3"))
...

}
  1. Sumar en android/build.gradle
build.gradle
buildscript {
  dependencies {
    // ... other dependencies
    // NOTE: if you are on react-native 0.71 or below, you must not update
    //       the google-services plugin past version 4.3.15 as it requires gradle >= 7.3.0
    classpath 'com.google.gms:google-services:4.4.1'
    // Add me --- /\
  }
}

Generar las credenciales de mi proyecto

Para comenzar con la configuracion de las notificaciones push en tu proyecto es necesario que generes las credenciales y lo configures en tu proyecto de FCM siguiendo los pasos de la documentación: Android credentials , iOS credentials una vez realizado esto reemplazar los archivos que viene en el template por el de tu proyecto.

Habilitar los permisos

Es necesario que para recibir notificaciones habilites los permisos para iOS y Android, en caso de Android es requerido a partir de API33. A continuacion te compartimos el link a las diferentes opciones:
- ios-requesting-permissions
- Android-requesting-permissions
- specific-setting-permissions

Envío de notificaciones

Desde la consola de firebase brinda una IU donde se pueden administrar los mensajes desde alli.
alt text
alt text

En caso de que necesite desarrollar un BackOffices para que los usuarios admin administren las notificaciones, es posible interactuar directamente contra la API Rest. Mas info

Registrar dispositivos

En aquellos casos donde se quiera enviar notificaciones a un grupo de usuarios especificos o notificaciones personales, es necesario registrar los dispositivos por unica ves. Como se muestra a continuación onAppBootstrap debe ser invocado si el dispositivo aun no se encuentra registrado en FCM y una vez que se obtenga el token se debe persistir para futuras notificaciones exclusivas para el dispositivo

import messaging from "@react-native-firebase/messaging";

async function onAppBootstrap() {
  // Register the device with FCM
  await messaging().registerDeviceForRemoteMessages();

  // Get the token
  const token = await messaging().getToken();

  // Save the token
  console.log("myToken notification:", token);
}

Subscribirse a mensajes

React Native Firebase proporciona dos métodos para suscribirse a mensajes y ambos reciben una carga útil de mensajes remotos:

onMessage: Maneja mensajes FCM cuando la aplicación está activa o en primer plano.
setBackgroundMessageHandler: Maneja mensajes de FCM cuando la aplicación está en estado cerrado.

async function onMessageReceived(message) {
  console.log(`Recibido ${JSON.stringify(message)}`);

  //my action with notification,
}

//callback cuando se recibe msg desde FCM
messaging().onMessage(onMessageReceived);

//trabaja en segundo plano
messaging().setBackgroundMessageHandler(onMessageReceived);

Mostrar la notification push

Para mostrar la notificacion del lado del clientemediante displayNotification() a traves de Notifee. Ver docu:

async function onMessageReceived(message) {
  console.log(`Recibido ${JSON.stringify(message)}`);

    await notifee.displayNotification({
        title: message.notification.title,
        body: message.notification.body,
        android: { channelId: "default" },
    });
}

Tambien es posible subscribirse a diferentes eventos que te permitiran manejar distintas acciones del usuario sobre las notificaciones. Ver la documentación

Conclusión:

En resumen, Firebase Cloud Messaging es una herramienta poderosa y versátil para la entrega de notificaciones push en aplicaciones móviles y web. Su capacidad para segmentar a los usuarios, entregar mensajes de manera confiable y proporcionar análisis detallados lo convierte en una opción popular entre los desarrolladores que buscan mejorar la interacción y la retención de usuarios en sus aplicaciones.

Demo