Configura una app cliente de Firebase Cloud Messaging en Flutter

Sigue estos pasos para configurar un cliente de FCM en Flutter.

Configuración y requisitos específicos de la plataforma

Algunos de los pasos necesarios dependen de la plataforma a la que te estás orientando.

iOS+

Habilita funciones de apps en Xcode

Antes de que tu aplicación pueda comenzar a recibir mensajes, debes habilitar las notificaciones push y los modos en segundo plano en tu proyecto de Xcode.

  1. Abre el lugar de trabajo de tu proyecto de Xcode (ios/Runner.xcworkspace).
  2. Habilita las notificaciones push.
  3. Habilita los modos de ejecución en segundo plano de recuperación y notificaciones remotas.

Sube tu clave de autenticación de APNS

Antes de usar FCM, sube tu certificado de APNS a Firebase. Si aún no tienes uno, créalo en el Centro para miembros de Apple Developer.

  1. Dentro del proyecto de Firebase console, selecciona el ícono de ajustes, Configuración del proyecto y, luego, selecciona la pestaña Cloud Messaging.
  2. Selecciona el botón Subir el certificado para el certificado de desarrollo, el certificado de producción o ambos. Se requiere al menos uno.
  3. Para cada certificado, selecciona el archivo .p12 y proporciona la contraseña, si corresponde. Asegúrate de que el ID del paquete de este certificado coincida con el ID del paquete de tu app. Selecciona Guardar.

Swizzling de métodos

Para usar el complemento FCM de Flutter en dispositivos Apple, no debes inhabilitar el swizzling de métodos. Esta función es obligatoria y, sin ella, las funciones clave de Firebase, como el control de tokens de FCM, no se ejecutan correctamente.

Android

Servicios de Google Play

Los clientes de FCM requieren dispositivos con Android 4.4 (o una versión más reciente) y los Servicios de Google Play instalados, o un emulador que ejecute Android 4.4 con las API de Google. Ten en cuenta que no estás limitado a implementar tus apps para Android a través de Google Play Store.

Las apps que usan el SDK de los Servicios de Play siempre deben revisar el dispositivo en busca de un APK de los Servicios de Google Play compatible antes de acceder a las funciones de los Servicios de Google Play. Se recomienda hacerlo en dos lugares: en el método onCreate() de la actividad principal y en su método onResume(). La verificación de onCreate() garantiza que la app no se pueda usar sin una verificación correcta. La verificación de onResume() garantiza que, si el usuario vuelve a la app en ejecución de alguna otra forma (por ejemplo, con el botón Atrás), la verificación se ejecute de todas formas.

Si el dispositivo no tiene una versión compatible de los Servicios de Google Play, tu app puede llamar a GoogleApiAvailability.makeGooglePlayServicesAvailable() para permitir que los usuarios los descarguen desde Play Store.

Web

Configura las credenciales web con FCM

La interfaz web de FCM usa credenciales web llamadas "Identificación voluntaria del servidor de aplicaciones", o claves "VAPID", para autorizar solicitudes de envío a servicios push web compatibles. Para suscribir tu app a las notificaciones push, debes asociar un par de claves a tu proyecto de Firebase. Puedes generar un nuevo par de claves o importar tu par de claves existente a través de Firebase console.

Genera un par de claves nuevo
  1. Abre la pestaña Cloud Messaging del panel Configuración de Firebase console y desplázate hasta la sección Configuración web.

  2. En la pestaña Certificados push web, haz clic en Generar par de claves. En la consola, se muestra un aviso de que se generó el nuevo par de claves, así como la cadena de la clave pública y la fecha de creación.

Importa un par de claves existente

Si tienes un par de claves que ya estás utilizando con tu app web, puedes importarlo a FCM para llegar a las instancias existentes de tu app web a través de las APIs de FCM. Para importar claves, debes tener acceso como propietario al proyecto de Firebase. Importa tus claves públicas y privadas existentes en forma de una URL base64 con codificación segura:

  1. Abre la pestaña Cloud Messaging del panel Configuración de Firebase console y desplázate hasta la sección Configuración web.

  2. En la pestaña Certificados push web, encuentra y selecciona el texto del vínculo “importar un par de claves existente”.

  3. En el cuadro de diálogo Importar un par de claves, ingresa tus claves públicas y privadas en los campos correspondientes y haz clic en Importar. En la consola, se muestra la string de la clave pública y la fecha de creación.

Si buscas más información sobre el formato de las claves y cómo generarlas, consulta Claves para servidor de aplicaciones.

Instala el complemento de FCM

  1. Instala e inicializa los complementos de Firebase para Flutter si aún no lo has hecho.

  2. Desde la raíz de tu proyecto de Flutter, ejecuta el siguiente comando para instalar el complemento:

    flutter pub add firebase_messaging
    
  3. Cuando termines, vuelve a compilar tu aplicación de Flutter:

    flutter run
    

Accede al token de registro

Para enviar mensajes a un dispositivo específico, es necesario conocer el token de registro del dispositivo. Dado que tienes que ingresar el token en un campo de la consola de Notifications para completar este instructivo, asegúrate de copiar el token o de almacenarlo en forma segura después de recuperarlo.

Si quieres recuperar el token de registro actual de una instancia de app, llama a getToken(). Si no se otorgó el permiso de notificación, este método le pedirá permisos de notificación al usuario. De lo contrario, se muestra un token o se rechaza el futuro debido a un error.

// You may set the permission requests to "provisional" which allows the user to choose what type
// of notifications they would like to receive once the user receives a notification.
final notificationSettings = await FirebaseMessaging.instance.requestPermission(provisional: true);

// For apple platforms, ensure the APNS token is available before making any FCM plugin API calls
final apnsToken = await FirebaseMessaging.instance.getAPNSToken();
if (apnsToken != null) {
 // APNS token is available, make FCM plugin API requests...
}

En plataformas web, pasa tu clave pública de VAPID a getToken():

final fcmToken = await FirebaseMessaging.instance.getToken(vapidKey: "BKagOny0KF_2pCJQ3m....moL0ewzQ8rZu");

Para recibir una notificación cada vez que se actualice el token, suscríbete al flujo de onTokenRefresh:

FirebaseMessaging.instance.onTokenRefresh
    .listen((fcmToken) {
      // TODO: If necessary send token to application server.

      // Note: This callback is fired at each app startup and whenever a new
      // token is generated.
    })
    .onError((err) {
      // Error getting token.
    });

Evita la inicialización automática

Cuando se genera un token de registro de FCM, la biblioteca sube el identificador y los datos de configuración a Firebase. Si prefieres que no se generen tokens automáticamente, inhabilita la inicialización automática durante el tiempo de compilación.

iOS

En iOS, agrega un valor de metadatos a Info.plist:

FirebaseMessagingAutoInitEnabled = NO

Android

En Android, inhabilita la recopilación de Analytics y la inicialización automática de FCM (debes inhabilitar ambas funciones). Para ello, agrega los siguientes valores de metadatos al archivo AndroidManifest.xml:

<meta-data
    android:name="firebase_messaging_auto_init_enabled"
    android:value="false" />
<meta-data
    android:name="firebase_analytics_collection_enabled"
    android:value="false" />

Vuelve a habilitar el inicio automático de FCM durante el tiempo de ejecución

Si quieres habilitar la inicialización automática para una instancia de app específica, llama a setAutoInitEnabled():

await FirebaseMessaging.instance.setAutoInitEnabled(true);

Este valor persiste en todos los reinicios de la app una vez establecido.

Próximos pasos

Cuando la app cliente esté configurada, estarás listo para comenzar a enviar mensajes descendentes con el Compositor de Notifications. Consulta Envía un mensaje de prueba a una app en segundo plano.

Para agregar otro comportamiento más avanzado a tu app, necesitarás una implementación de servidor.

Luego, sigue estos pasos en el cliente de la app: