Premiers pas avec Firebase Cloud Messaging


 Ce guide de démarrage rapide explique comment configurer Firebase Cloud Messaging dans vos applications clientes mobiles et Web pour pouvoir envoyer des messages de manière fiable. Pour les environnements serveur, consultez Votre environnement serveur et FCM.

Configurer une application cliente Firebase Cloud Messaging sur Flutter

Selon la plate-forme que vous ciblez, vous devrez effectuer des étapes de configuration supplémentaires.

iOS+

Méthode swizzling

Pour utiliser le plug-in Flutter FCM sur les appareils Apple, le swizzling de méthode est requis. Sans ce fichier, les fonctionnalités clés de Firebase, telles que la gestion des jetons FCM, ne fonctionneront pas correctement.

Android

Services Google Play

Les clients FCM nécessitent des appareils exécutant Android 4.4 ou version ultérieure sur lesquels les services Google Play sont installés, ou un émulateur exécutant Android 4.4 avec les API Google. Notez que vous n'êtes pas limité au déploiement de vos applications Android via le Google Play Store.

Les applications qui s'appuient sur le SDK des services Play doivent toujours vérifier si l'appareil dispose d'un APK des services Google Play compatible avant d'accéder aux fonctionnalités des services Google Play. Il est recommandé de le faire à deux endroits : dans la méthode onCreate() de l'activité principale et dans sa méthode onResume(). La vérification dans onCreate() s'assure que l'application ne peut pas être utilisée sans vérification réussie. La vérification dans onResume() s'assure que si l'utilisateur revient à l'application en cours d'exécution par un autre moyen, par exemple via le bouton "Retour", la vérification est toujours effectuée.

Si l'appareil ne dispose pas d'une version compatible des services Google Play, votre application peut appeler GoogleApiAvailability.makeGooglePlayServicesAvailable() pour permettre aux utilisateurs de télécharger les services Google Play depuis le Play Store.

Web

Configurer les identifiants Web avec FCM

L'interface Web FCM utilise des identifiants Web appelés clés VAPID (Voluntary Application Server Identification) pour autoriser les requêtes d'envoi aux services Web push compatibles. Pour abonner votre application aux notifications push, vous devez associer une paire de clés à votre projet Firebase. Vous pouvez générer une paire de clés ou importer votre paire de clés existante à l'aide de la console Firebase.

Installer le plug-in FCM

  1. Installez et initialisez les plug-ins Firebase pour Flutter, si ce n'est pas déjà fait.

  2. À la racine de votre projet Flutter, exécutez la commande suivante pour installer le plug-in :

    flutter pub add firebase_messaging

  3. Une fois cette étape effectuée, recréez votre application Flutter :

    flutter run

Accéder au jeton d'enregistrement

Pour envoyer un message à un appareil spécifique, vous devez connaître le jeton d'enregistrement de l'appareil. Pour récupérer le jeton d'enregistrement d'une instance d'application, appelez getToken(). Si l'autorisation de notification n'a pas été accordée, cette méthode demandera à l'utilisateur l'autorisation de notification. Sinon, il renvoie un jeton ou refuse la future en raison d'une erreur.

// 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, make sure 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...
}

Sur les plates-formes Web, transmettez votre clé publique VAPID à getToken() :

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

Pour être averti chaque fois que le jeton est mis à jour, abonnez-vous au flux 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.
    });

Empêcher l'initialisation automatique

Lorsqu'un jeton d'enregistrement FCM est généré, la bibliothèque importe l'identifiant et les données de configuration dans Firebase. Si vous préférez empêcher la génération automatique de jetons, désactivez l'initialisation automatique au moment de la compilation.

iOS

Sur iOS, ajoutez une valeur de métadonnées à votre Info.plist :

FirebaseMessagingAutoInitEnabled = NO

Android

Sur Android, désactivez la collecte Analytics et l'initialisation automatique de FCM (vous devez désactiver les deux) en ajoutant ces valeurs de métadonnées à votre 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" />

Réactiver l'initialisation automatique de FCM au moment de l'exécution

Pour activer l'initialisation automatique pour une instance d'application spécifique, appelez setAutoInitEnabled() :

await FirebaseMessaging.instance.setAutoInitEnabled(true);

Une fois définie, cette valeur persiste lors des redémarrages de l'application.

Envoyer un message de notification test

  1. Installez et exécutez l'application sur l'appareil cible. Sur les appareils Apple, vous devez 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 "Messaging".
  4. S'il s'agit de votre premier message, sélectionnez Créer votre première campagne.
    1. Sélectionnez Messages de notification Firebase, puis Créer.
  5. Sinon, dans l'onglet Campagnes, sélectionnez Nouvelle campagne, puis Notifications.
  6. Saisissez le texte du message.
  7. Dans le volet de droite, sélectionnez Envoyer un message test.
  8. Dans le champ Ajouter un jeton d'enregistrement FCM, saisissez votre jeton d'enregistrement.
  9. Sélectionnez Tester.

Après avoir sélectionné Tester, l'appareil client cible, avec l'application en arrière-plan, devrait recevoir la notification.

Pour obtenir des informations sur la diffusion des messages dans votre application, consultez le tableau de bord des rapports FCM, qui enregistre le nombre de messages envoyés et ouverts sur les appareils Apple et Android, ainsi que les données d'impression pour les applications Android.

Gérer les 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 arrêtée, elle sera démarrée. Si elle est en arrière-plan, elle sera mise au premier plan.

En fonction du contenu d'une notification, vous pouvez gérer l'interaction de l'utilisateur lorsque l'application s'ouvre. Par exemple, si un nouveau message de chat est envoyé à l'aide d'une notification et que l'utilisateur le sélectionne, vous pouvez ouvrir la conversation spécifique lorsque l'application s'ouvre.

Le package firebase-messaging propose deux façons de gérer cette interaction :

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

Pour que vos utilisateurs bénéficient d'une expérience fluide, vous devez gérer les deux scénarios. L'exemple de code suivant montre comment procéder :

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

class _Application extends State {
  // In this example, suppose that all messages contain a data field with the key 'type'.
  Future 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 using 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 votre configuration. L'exemple présenté précédemment est un exemple de base d'utilisation d'une StatefulWidget.

Étapes suivantes

Une fois les étapes de configuration terminées, voici quelques options pour aller plus loin avec FCM pour Flutter :