Envía un mensaje de prueba a una app en segundo plano

Para comenzar a usar FCM, crea el caso de uso más sencillo: enviar un mensaje de notificación de prueba desde el Compositor de Notifications a un dispositivo de desarrollo cuando la app se encuentra en segundo plano. En esta página, se indican todos los pasos necesarios para lograrlo, desde la configuración hasta la verificación. Es posible que ya hayas realizado algunos de los pasos si configuraste una app cliente de JavaScript para FCM.

Instala el complemento de FCM

  1. Instala e inicializa los SDK 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.

final fcmToken = await FirebaseMessaging.instance.getToken();

Envía un mensaje de notificación de prueba

  1. Instala y ejecuta la app en el dispositivo de destino. En los dispositivos Apple, tendrás que aceptar la solicitud de permiso para recibir notificaciones remotas.

  2. Asegúrate de que la app se encuentre en segundo plano en el dispositivo.

  3. En Firebase console, abre la página Mensajes.

  4. Si este es tu primer mensaje, selecciona Crear la primera campaña.

    1. Selecciona Mensajes de Firebase Notifications y, luego, Crear.
  5. De lo contrario, en la pestaña Campañas, selecciona Campaña nueva y, luego, Notificaciones.

  6. Ingresa el texto del mensaje. Todos los demás campos son opcionales.

  7. Selecciona Enviar mensaje de prueba en el panel derecho.

  8. En el campo Agregar un token de registro de FCM, ingresa el token de registro que obtuviste en una sección anterior de esta guía.

  9. Selecciona Probar.

Después de seleccionar Probar, los dispositivos cliente de destino que tienen la app en segundo plano recibirán la notificación.

Para obtener información sobre la entrega de mensajes en tu app, consulta el panel de informes de FCM, en el que se registra la cantidad de mensajes que se enviaron y abrieron en dispositivos Apple y Android, junto con datos de “impresiones” (las notificaciones que ven los usuarios) de las apps para Android.

Controla las interacciones

Cuando los usuarios presionan una notificación, el comportamiento predeterminado en dispositivos iOS y Android es abrir la aplicación. Si la aplicación está cerrada, se iniciará y si está en segundo plano, pasará a primer plano.

Según el contenido de la notificación, es posible que quieras controlar la interacción del usuario cuando se abra la aplicación. Por ejemplo, si la notificación contiene un nuevo mensaje de chat y el usuario la selecciona, es posible que quieras que la aplicación se abra en la conversación específica.

El paquete firebase-messaging proporciona dos formas de controlar esta interacción:

  1. getInitialMessage(): Si la aplicación se abre desde un estado finalizado, este método muestra un Future que contiene un RemoteMessage. Una vez que se consuma, se quitará el RemoteMessage.
  2. onMessageOpenedApp: Es un Stream que publica un RemoteMessage cuando la aplicación se abre desde un estado en segundo plano.

Para garantizar una experiencia fluida para sus usuarios, debes controlar ambas situaciones. En el siguiente ejemplo de código, se describe cómo hacerlo:

class Application extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _Application();
}

class _Application extends State<Application> {
  // In this example, suppose that all messages contain a data field with the key 'type'.
  Future<void> setupInteractedMessage() async {
    // Get any messages which caused the application to open from
    // a terminated state.
    RemoteMessage? initialMessage =
        await FirebaseMessaging.instance.getInitialMessage();

    // If the message also contains a data property with a "type" of "chat",
    // navigate to a chat screen
    if (initialMessage != null) {
      _handleMessage(initialMessage);
    }

    // Also handle any interaction when the app is in the background via a
    // Stream listener
    FirebaseMessaging.onMessageOpenedApp.listen(_handleMessage);
  }

  void _handleMessage(RemoteMessage message) {
    if (message.data['type'] == 'chat') {
      Navigator.pushNamed(context, '/chat',
        arguments: ChatArguments(message),
      );
    }
  }

  @override
  void initState() {
    super.initState();

    // Run code required to handle interacted messages in an async function
    // as initState() must not be async
    setupInteractedMessage();
  }

  @override
  Widget build(BuildContext context) {
    return Text("...");
  }
}

La forma en que controlas las interacciones depende de la configuración de tu app. En el ejemplo anterior, se muestra un ejemplo básico del uso de un StatefulWidget.

Próximos pasos

Envía mensajes a apps en primer plano

Una vez que envíes mensajes de notificación de manera correcta mientras la app está en segundo plano, consulta Recibe mensajes en una app para Flutter a fin de comenzar a enviar mensajes a apps en primer plano.

Más allá de las notificaciones

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: