Guide d'intégration de base du SDK Flutter

Cette section contient des informations sur la manière d’intégrer le SDK Flutter de Pushwoosh dans votre application.

Prérequis

Pour intégrer le SDK Flutter de Pushwoosh dans votre application, vous aurez besoin des éléments suivants :

Exigences

• Un compte Pushwoosh.
• Un projet Pushwoosh configuré dans votre compte.
• Pour l’intégration iOS :
  • Une plateforme iOS configurée pour envoyer des notifications push. Nous vous recommandons d’utiliser la configuration d’authentification basée sur un token comme approche la plus simple.
  • Réglez la Gateway sur Sandbox pour envoyer des pushes à un simulateur.
• Pour l’intégration Android :
  • Une plateforme Android configurée
  • Le numéro de projet (également connu sous le nom de Sender ID), le fichier google-services.json et le nom du package de votre projet Firebase.
  • Un projet Firebase connecté à votre application Android. Suivez le guide de configuration de Firebase si nécessaire.
• Votre code d'application Pushwoosh et votre token d’API de l’appareil Pushwoosh depuis le panneau de contrôle Pushwoosh pour votre application.

Étapes d’intégration

1. Ajouter la dépendance du SDK Flutter de Pushwoosh

Ajoutez le package pushwoosh_flutter à votre fichier pubspec.yaml :

pubspec.yaml

dependencies:
  flutter:
    sdk: flutter
  # Utilisez la dernière version de https://pub.dev/packages/pushwoosh_flutter
  pushwoosh_flutter: ^[LATEST_VERSION]

Vérifiez la dernière version sur pub.dev.

Ensuite, exécutez la commande suivante dans le répertoire racine de votre projet pour installer la dépendance :

flutter pub get

Vérifiez que le package est correctement installé :

flutter pub deps | grep pushwoosh_flutter

# Exemple de sortie :
# ❯ flutter pub deps | grep pushwoosh_flutter
# └── pushwoosh_flutter 2.3.11

2. Initialisation du SDK Flutter

Dans le composant racine de votre fichier main.dart :

• Importez le package pushwoosh_flutter.
• Initialisez le SDK Pushwoosh.
• Appelez registerForPushNotifications() dans votre logique d’initialisation pour vous enregistrer aux notifications push.

main.dart

import 'package:pushwoosh_flutter/pushwoosh_flutter.dart';

void main() async {
  runApp(const MyApp());
  Pushwoosh.initialize({
    "app_id": "__YOUR_APP_ID__",
    "sender_id": "__YOUR_FCM_SENDER_ID__"
  });
  Pushwoosh.getInstance.registerForPushNotifications();
}

Où :

• __YOUR_APP_ID__ est le code de l’application provenant du panneau de contrôle Pushwoosh.
• __YOUR_FCM_SENDER_ID__ est le numéro de projet Firebase provenant de la console Firebase.

3. Configuration native iOS

3.1 Capacités

Pour activer les notifications push dans votre projet, vous devez ajouter certaines capacités.

Dans la section Signing & Capabilities, ajoutez les capacités suivantes :

• Push Notifications
• Background Modes. Après avoir ajouté cette capacité, cochez la case Remote notifications.

Si vous avez l’intention d’utiliser les notifications sensibles au temps (iOS 15+), ajoutez également la capacité Time Sensitive Notifications.

3.2 Info.plist

Dans votre Runner/Info.plist, définissez la clé __PUSHWOOSH_DEVICE_API_TOKEN__ sur le token d’API de l’appareil Pushwoosh :

info.plist

<key>Pushwoosh_API_TOKEN</key>
<string>__PUSHWOOSH_DEVICE_API_TOKEN__</string>

3.3 Suivi de la livraison des messages

Vous devez ajouter une cible d’extension de service de notification à votre projet. Ceci est essentiel pour un suivi précis de la livraison et des fonctionnalités comme les Rich Media sur iOS.

Suivez les étapes du guide natif pour ajouter la cible d’extension et le code Pushwoosh nécessaire à l’intérieur.

Pour vous assurer que l’extension de service de notification est correctement intégrée dans votre projet Flutter, vous devez utiliser la configuration Podfile suivante :

Podfile

target 'NotificationServiceExtension' do
  use_frameworks!
  use_modular_headers!

  pod 'PushwooshXCFramework'

  inherit! :search_paths
end

3.4 Installation des dépendances pour le projet Flutter iOS

Pour installer les dépendances pour le projet Flutter iOS, exécutez la commande suivante :

flutter run

ou naviguez vers le dossier ios dans le terminal et exécutez :

pod install --repo-update

4. Configuration native Android

4.1 Installer les dépendances

Assurez-vous que les dépendances et plugins requis sont ajoutés à vos scripts Gradle :

Ajoutez le plugin Gradle des services Google aux dépendances de votre build.gradle au niveau du projet :

android/build.gradle

buildscript {
  dependencies {
    classpath 'com.google.gms:google-services:4.3.15'
  }
}

Appliquez le plugin dans votre fichier build.gradle au niveau de l’application :

app/build.gradle

apply plugin: 'com.google.gms.google-services'

4.2 Ajouter le fichier de configuration Firebase

Placez le fichier google-services.json dans le dossier android/app de votre répertoire de projet.

4.3 Ajouter les métadonnées Pushwoosh

Dans votre main/AndroidManifest.xml, ajoutez le token d’API de l’appareil Pushwoosh à l’intérieur de la balise <application> :

AndroidManifest.xml

<meta-data android:name="com.pushwoosh.apitoken" android:value="__YOUR_DEVICE_API_TOKEN__" />

Important : Assurez-vous de donner au token l’accès à la bonne application dans votre panneau de contrôle Pushwoosh. En savoir plus

5. Exécuter le projet

1. Compilez et exécutez le projet.
2. Allez dans le panneau de contrôle Pushwoosh et envoyez une notification push.
3. Vous devriez voir la notification dans l’application.

Intégration étendue

À ce stade, vous avez déjà intégré le SDK et pouvez envoyer et recevoir des notifications push. Explorons maintenant les fonctionnalités de base.

Écouteurs d’événements de notification push

Dans le SDK Pushwoosh, il y a deux écouteurs d’événements, conçus pour gérer les notifications push :

• L’événement onPushReceived est déclenché lorsqu’une notification push est reçue.
• L’événement onPushAccepted est déclenché lorsqu’un utilisateur ouvre une notification.

Vous devez configurer ces écouteurs d’événements juste après l’initialisation du SDK au démarrage de l’application :

import 'package:pushwoosh_flutter/pushwoosh_flutter.dart';

class PushwooshNotificationHandler {
  void setupPushListeners(Pushwoosh pushwoosh) {

    pushwoosh.onPushReceived.listen((event) {
      print("Push received: ${event.pushwooshMessage.payload}");
    });

    pushwoosh.onPushAccepted.listen((event) {
      print("Push accepted: ${event.pushwooshMessage.payload}");
    });

  }
}

Configuration de l’utilisateur

En vous concentrant sur le comportement et les préférences individuels des utilisateurs, vous pouvez fournir un contenu personnalisé, ce qui entraîne une augmentation de la satisfaction et de la fidélité des utilisateurs.

import 'package:pushwoosh_flutter/pushwoosh_flutter.dart';

class Registration {
  void afterUserLogin(User user) {

    // Définir l'ID utilisateur
    Pushwoosh().setUserId(user.getId());

    // Définir l'e-mail de l'utilisateur
    Pushwoosh().setEmail(user.getEmail());

    // Enregistrer le numéro SMS
    // Les numéros SMS et WhatsApp doivent être au format E.164 (par ex., "+1234567890") et être valides
    Pushwoosh().registerSmsNumber(user.getSmsNumber());

    // Enregistrer le numéro WhatsApp
    Pushwoosh().registerWhatsappNumber(user.getWhatsappNumber());

    // Définir des informations utilisateur supplémentaires comme des tags pour Pushwoosh
    Pushwoosh().setTags({
      "age": user.getAge(),
      "name": user.getName(),
      "last_login": user.getLastLoginDate()
    });
  }
}

Tags

Les tags sont des paires clé-valeur attribuées aux utilisateurs ou aux appareils, permettant une segmentation basée sur des attributs tels que les préférences ou le comportement, ce qui permet une messagerie ciblée.

import 'package:pushwoosh_flutter/pushwoosh_flutter.dart';

class UpdateUser {
  void afterUserUpdateProfile(User user) {

    // Définir la liste des catégories favorites
    Pushwoosh().setTags({
      "favorite_categories": user.getFavoriteCategoriesList()
    });

    // Définir les informations de paiement
    Pushwoosh().setTags({
      "is_subscribed": user.isSubscribed(),
      "payment_status": user.getPaymentStatus(),
      "billing_address": user.getBillingAddress()
    });
  }
}

Événements

Les événements sont des actions ou des occurrences spécifiques de l’utilisateur dans l’application qui peuvent être suivies pour analyser le comportement et déclencher des messages ou des actions correspondantes.

import 'package:pushwoosh_flutter/pushwoosh_flutter.dart';

class Registration {

  // Suivre l'événement de connexion
  void afterUserLogin(User user) {
    Pushwoosh().postEvent("login", {
      "name": user.getName(),
      "last_login": user.getLastLoginDate()
    });
  }

  void afterUserPurchase(Product product) {

  // Suivre l'événement d'achat
  Pushwoosh().postEvent("purchase", {
    "product_id": product.getId(),
    "product_name": product.getName(),
    "price": product.getPrice(),
    "quantity": product.getQuantity()
  });
 }
}

Utilisation de ProGuard

Note

Notez que la commande flutter build apk obscurcit votre code par défaut.

Ainsi, vous pourriez obtenir cette exception :

java.lang.IllegalStateException: Could not find class for name: com.pushwoosh.plugin.PushwooshNotificationServiceExtension

Il y a deux solutions dans ce cas :

1. Utilisez la commande flutter build apk --no-shrink pour compiler votre code sans obscurcissement.
2. Ou vous pouvez activer manuellement ProGuard et ajouter les règles nécessaires.

Pour activer ProGuard pour votre projet, ajoutez les chaînes suivantes à votre fichier build.gradle :

build.gradle

buildTypes {
        release {
            minifyEnabled true
            useProguard true
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'

            signingConfig signingConfigs.debug
        }
    }

Ensuite, ajoutez les règles suivantes au fichier android/app/proguard-rules.pro

proguard-rules.pro

#Pushwoosh Flutter
-keep class com.pushwoosh.plugin.PushwooshPlugin { *; }
-keep class com.pushwoosh.plugin.PushwooshNotificationServiceExtension { *; }

Dépannage

Si vous rencontrez des problèmes lors du processus d’intégration, veuillez vous référer à la section support et communauté.