Envoyer un message test à une application en arrière-plan

Pour démarrer avec FCM, créez le cas d'utilisation le plus simple : envoyer un message de notification de test du compositeur de notifications à un appareil de développement lorsque l'application est en arrière-plan sur l'appareil. Cette page répertorie toutes les étapes pour y parvenir, de la configuration à la vérification. Elle peut couvrir les étapes que vous avez déjà effectuées si vous avez configuré une application Flutter pour FCM.

Installez le plugin FCM

  1. Installez et initialisez les SDK Firebase pour Flutter si vous ne l'avez pas déjà fait.

  2. Depuis la racine de votre projet Flutter, exécutez la commande suivante pour installer le plugin :

    flutter pub add firebase_messaging
    
  3. Une fois terminé, reconstruisez votre application Flutter :

    flutter run
    

Accéder au jeton d'inscription

Pour envoyer un message à un appareil spécifique, vous devez connaître le jeton d'enregistrement de cet appareil. Étant donné que vous devrez saisir le jeton dans un champ de la console de notifications pour terminer ce didacticiel, assurez-vous de copier le jeton ou de le stocker en toute sécurité après l'avoir récupéré.

Pour récupérer le jeton d'enregistrement actuel pour une instance d'application, appelez getToken() . Si l'autorisation de notification n'a pas été accordée, cette méthode demandera à l'utilisateur les autorisations de notification. Sinon, il renvoie un jeton ou rejette le futur en raison d'une erreur.

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

Envoyer un message de notification de test

  1. Installez et exécutez l'application sur l'appareil cible. Sur les appareils Apple, vous devrez accepter la demande d'autorisation pour recevoir des notifications à distance.

  2. Assurez-vous que l'application est en arrière-plan sur l'appareil.

  3. Dans la console Firebase, ouvrez la page Messagerie .

  4. S'il s'agit de votre premier message, sélectionnez Créer votre première campagne .

    1. Sélectionnez Messages de notification Firebase et sélectionnez Créer .
  5. Sinon, sous l'onglet Campagnes , sélectionnez Nouvelle campagne puis Notifications .

  6. Saisissez le texte du message. Tous les autres champs sont facultatifs.

  7. Sélectionnez Envoyer un message test dans le volet de droite.

  8. Dans le champ intitulé Ajouter un jeton d'enregistrement FCM , saisissez le jeton d'enregistrement que vous avez obtenu dans une section précédente de ce guide.

  9. Sélectionnez Tester .

Après avoir sélectionné Test , l'appareil client ciblé (avec l'application en arrière-plan) devrait recevoir la notification.

Pour obtenir un aperçu de la transmission des messages à votre application, consultez le tableau de bord de reporting FCM , qui enregistre le nombre de messages envoyés et ouverts sur les appareils Apple et Android, ainsi que les données sur les « impressions » (notifications vues par les utilisateurs) pour les applications Android.

Gestion des interactions

Lorsque les utilisateurs appuient sur une notification, le comportement par défaut sur Android et iOS consiste à ouvrir l'application. Si l'application est terminée, elle sera démarrée, et si elle est en arrière-plan, elle sera mise au premier plan.

En fonction du contenu d'une notification, vous souhaiterez peut-être gérer l'interaction de l'utilisateur à l'ouverture de l'application. Par exemple, si un nouveau message de discussion est envoyé à l'aide d'une notification et que l'utilisateur le sélectionne, vous souhaiterez peut-être ouvrir la conversation spécifique à l'ouverture de l'application.

Le package firebase-messaging propose deux manières de gérer cette interaction :

  1. getInitialMessage() : Si l'application est ouverte à partir d'un état terminé, cette méthode renvoie un Future contenant un RemoteMessage . Une fois consommé, le RemoteMessage sera supprimé.
  2. onMessageOpenedApp : un Stream qui publie un RemoteMessage lorsque l'application est ouverte en arrière-plan.

Pour garantir une expérience fluide à vos utilisateurs, vous devez gérer les deux scénarios. L'exemple de code ci-dessous explique comment cela peut être réalisé :

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 façon dont vous gérez l’interaction dépend de la configuration de votre application. L'exemple ci-dessus montre un exemple de base d'utilisation d'un StatefulWidget .

Prochaines étapes

Envoyer des messages aux applications au premier plan

Une fois que vous avez envoyé avec succès des messages de notification alors que votre application est en arrière-plan, consultez Recevoir des messages dans une application Flutter pour commencer à envoyer vers des applications au premier plan.

Allez au-delà des messages de notification

Pour ajouter un autre comportement plus avancé à votre application, vous aurez besoin d'une implémentation de serveur .

Ensuite, dans votre client d'application :