Intégration SDK Braze
Découvrez comment intégrer le SDK de Braze dans votre application mobile. Chaque SDK est hébergé dans son propre dépôt public GitHub, qui comprend des exemples d’applications entièrement constructibles que vous pouvez utiliser pour tester les fonctionnalités de Braze ou mettre en œuvre parallèlement à vos propres applications. Pour en savoir plus, consultez les références, les référentiels et les exemples d’applications. Pour plus d’informations générales sur le SDK, consultez le site Getting started : Aperçu de l’intégration.
À propos du SDK de Braze
Le SDK Web Braze vous permet de collecter des analyses/analytiques et d’afficher des messages in-app riches, des messages push et des cartes de contenu à vos utilisateurs web. Pour plus d’informations, consultez la documentation de référence JavaScript de Braze.
Ce guide utilise des exemples de code du SDK Web de Braze 4.0.0+. Pour passer à la dernière version du SDK Web, consultez le Guide de mise à niveau du SDK.
Intégrer le SDK Web
Vous pouvez intégrer le SDK de Braze Web à l’aide des méthodes suivantes. Pour d’autres options, voir d ‘autres méthodes d’intégration.
- L’intégration basée sur le code : Intégrez le SDK Braze directement dans votre base de code à l’aide de votre gestionnaire de paquets préféré ou du réseau de diffusion de Braze. Vous avez ainsi un contrôle total sur le chargement et la configuration du SDK.
- Google Tag Manager : Une solution sans code qui vous permet d’intégrer le SDK de Braze Web sans modifier le code de votre site. Pour plus d’informations, consultez Google Tag Manager avec le SDK de Braze.
Nous vous recommandons d’utiliser la méthode d’intégration NPM. Parmi les avantages, citons le stockage des bibliothèques SDK localement sur votre site web, l’immunité contre les extensions de blocage publicitaire et la contribution à des temps de chargement plus rapides dans le cadre de la prise en charge du bundler.
Étape 1 : Installer la bibliothèque Braze
Vous pouvez installer la bibliothèque Braze en utilisant l’une des méthodes suivantes. Toutefois, si votre site web utilise un site Content-Security-Policy, examinez la politique de sécurité du contenu avant de continuer.
Bien que la plupart des bloqueurs de publicité ne bloquent pas le SDK Braze Web, certains bloqueurs de publicité plus restrictifs sont connus pour causer des problèmes.
Si votre site utilise les gestionnaires de paquets NPM ou Yarn, vous pouvez ajouter le paquet NPM de Braze comme dépendance.
Les définitions TypeScript sont désormais comprises dans la version v3.0.0. Pour obtenir les notes sur la mise à jour de 2.x vers 3.x, consultez notre journal des modifications.
1
2
3
npm install --save @braze/web-sdk
# or, using yarn:
# yarn add @braze/web-sdk
Une fois installé, vous pouvez import ou require la bibliothèque de la manière habituelle :
1
2
3
import * as braze from "@braze/web-sdk";
// or, using `require`
const braze = require("@braze/web-sdk");
Ajoutez le SDK Braze pour le Web directement à votre code HTML en faisant référence à notre script hébergé par le CDN (réseau de diffusion de contenu), qui charge la bibliothèque asynchrone.
Le paramètre par défaut Prévenir le suivi intersite dans Safari peut empêcher les types de messages in-app tels que les bannières et les cartes de contenu de s’afficher lorsque vous utilisez la méthode d’intégration du réseau in-app. Pour éviter ce problème, utilisez la méthode d’intégration NPM afin que Safari ne classe pas ces messages comme du trafic intersite et que vos internautes puissent les voir dans tous les navigateurs pris en charge.
Étape 2 : Initialiser le SDK
Une fois le SDK Web de Braze ajouté à votre site Web, initialisez la bibliothèque à l’aide de la clé API et de l’URL de l’endpoint du SDK que vous trouverez dans Paramètres > Paramètres de l’application dans votre tableau de bord de Braze. Pour obtenir une liste complète des options de braze.initialize(), ainsi que de nos autres méthodes JavaScript, consultez la documentation JavaScript de Braze.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// initialize the SDK
braze.initialize('YOUR-API-KEY-HERE', {
baseUrl: "YOUR-SDK-ENDPOINT-HERE",
enableLogging: false, // set to `true` for debugging
allowUserSuppliedJavascript: false, // set to `true` to support custom HTML messages
});
// Enable automatic display of in-app messages
// Required if you want in-app messages to display automatically when triggered
braze.automaticallyShowInAppMessages();
// if you use Content Cards
braze.subscribeToContentCardsUpdates(function(cards){
// cards have been updated
});
// optionally set the current user's external ID before starting a new session
// you can also call `changeUser` later in the session after the user logs in
if (isLoggedIn){
braze.changeUser(userIdentifier);
}
// `openSession` should be called last - after `changeUser` and `automaticallyShowInAppMessages`
braze.openSession();
Affichage in-app des messages: Pour afficher automatiquement les messages in-app lorsqu’ils sont déclenchés, vous devez appeler braze.automaticallyShowInAppMessages(). Sans cet appel, les messages in-app ne s’affichent pas automatiquement. Si vous souhaitez gérer l’envoi des messages manuellement, supprimez cet appel et utilisez plutôt braze.subscribeToInAppMessage(). Pour plus d’informations, consultez la rubrique Réception/distribution de messages in-app.
Les utilisateurs anonymes sur des appareils mobiles ou web peuvent être comptabilisés dans votre MAU. Par conséquent, vous pouvez charger ou initialiser conditionnellement le SDK pour exclure ces utilisateurs de votre décompte de MAU.
Conditions préalables
Avant de pouvoir utiliser cette méthode d’intégration, vous devez créer un compte et un conteneur pour Google Tag Manager.
Étape 1 : Ouvrez la galerie de modèles d’étiquettes
Dans Google Tag Manager, choisissez votre espace de travail, puis sélectionnez Modèles. Dans la sous-fenêtre Modèle d’étiquette, sélectionnez Galerie de recherche.

Étape 2 : Ajouter le modèle d’étiquette d’initialisation
Dans la galerie de modèles, recherchez braze-inc, puis sélectionnez Braze Initialization Tag.

Sélectionnez Ajouter à l’espace de travail > Ajouter.

Étape 3 : Configurer l’étiquette
Dans la section Modèles, sélectionnez le modèle que vous venez d’ajouter.

Sélectionnez l’icône en forme de crayon pour ouvrir le menu déroulant Configuration des étiquettes.

Saisissez les informations minimales requises :
| Champ | Description |
|---|---|
| Clé API | Votre clé API Braze, que vous trouverez dans le tableau de bord de Braze sous Paramètres > Paramètres de l’application. |
| Endpoint de l’API | L’URL de votre endpoint REST. Votre endpoint dépendra de l’URL de Braze pour votre instance. |
| Version du SDK | La version MAJOR.MINOR la plus récente du SDK Braze Web figurant dans le journal des modifications. Par exemple, si la dernière version est 4.1.2, saisissez 4.1. Pour plus d’informations, voir À propos de la gestion des versions du SDK. |
Pour des paramètres d’initialisation supplémentaires, sélectionnez Options d’initialisation de Braze et choisissez les options dont vous avez besoin.

Étape 4 : Réglé sur Déclencheur sur toutes les pages
L’étiquette d’initialisation doit être exécutée sur toutes les pages de votre site. Cela vous permet d’utiliser les méthodes du SDK de Braze et d’enregistrer les analyses/analytiques du web push.
Étape 5 : Vérifiez votre intégration
Vous pouvez vérifier votre intégration en utilisant l’une des options suivantes :
- Option 1 : Grâce à l’ outil de débogage de Google Tag Manager, vous pouvez vérifier si l’étiquette d’initialisation Braze se déclenche correctement sur vos pages ou événements configurés.
- Option 2 : Vérifiez si des requêtes réseau sont adressées à Braze depuis votre page web. En outre, la bibliothèque globale
window.brazedoit maintenant être définie.
Configurations optionnelles
Journalisation
Pour activer rapidement la journalisation, vous pouvez ajouter ?brazeLogging=true comme paramètre à l’URL de votre site web. Vous pouvez également activer la journalisation de base ou personnalisée.
Journalisation de base
Utilisez enableLogging pour enregistrer des messages de débogage de base dans la console JavaScript avant l’initialisation du SDK.
1
enableLogging: true
Votre méthode doit être similaire à la suivante :
1
2
3
4
5
braze.initialize('API-KEY', {
baseUrl: 'API-ENDPOINT',
enableLogging: true
});
braze.openSession();
Utilisez braze.toggleLogging() pour enregistrer des messages de débogage de base dans la console JavaScript après l’initialisation du SDK. Votre méthode doit être similaire à la suivante :
1
2
3
4
5
6
braze.initialize('API-KEY', {
baseUrl: 'API-ENDPOINT',
});
braze.openSession();
...
braze.toggleLogging();
Les journaux de base sont visibles par tous les utilisateurs, il faut donc envisager de les désactiver ou de passer à setLoggeravant de mettre votre code en production.
Journalisation personnalisée
Utilisez setLogger pour enregistrer des messages de débogage personnalisés dans la console JavaScript. Contrairement aux journaux de base, ces journaux ne sont pas visibles par les utilisateurs.
1
setLogger(loggerFunction: (message: STRING) => void): void
Remplacez STRING par votre message sous la forme d’une chaîne de caractères unique. Votre méthode doit être similaire à la suivante :
1
2
3
4
5
braze.initialize('API-KEY');
braze.setLogger(function(message) {
console.log("Braze Custom Logger: " + message);
});
braze.openSession();
Mise à niveau du SDK
Ce guide utilise des exemples de code du SDK Web de Braze 4.0.0+. Pour passer à la dernière version du SDK Web, consultez le Guide de mise à niveau du SDK.
Lorsque vous référencez le SDK Web de Braze à partir de notre réseau de réception/distribution de contenu, par exemple, https://js.appboycdn.com/web-sdk/a.a/braze.min.js (comme le recommandent nos instructions d’intégration par défaut), vos utilisateurs reçoivent automatiquement des mises à jour mineures (corrections de bogues et fonctionnalités rétrocompatibles, versions a.a.a à a.a.z dans les exemples ci-dessus) lorsqu’ils actualisent votre site.
Cependant, lorsque nous publions des changements majeurs, nous vous demandons de mettre à jour manuellement le SDK Braze Web afin de garantir que les changements de rupture n’ont pas d’impact sur votre intégration. En outre, si vous téléchargez notre SDK et l’hébergez vous-même, vous ne recevrez pas automatiquement les mises à jour de version et devrez effectuer une mise à niveau manuelle pour bénéficier des dernières fonctionnalités et corrections de bogues.
Vous pouvez vous tenir au courant de notre dernière version en suivant notre flux de publication avec le lecteur RSS ou le service de votre choix, et consulter notre journal des modifications pour un compte-rendu complet de l’historique des versions de notre SDK Web. Pour mettre à niveau le SDK Braze pour le Web :
- Mettez à jour la version de la bibliothèque Braze en modifiant le numéro de version de
https://js.appboycdn.com/web-sdk/[OLD VERSION NUMBER]/braze.min.jsou dans les dépendances de votre responsable de packages. - Si vous avez intégré des notifications push pour le Web, mettez à jour le fichier du service de traitement sur votre site. Par défaut, ce paramètre est situé à
/service-worker.jsdans le répertoire racine de votre site, mais l’emplacement peut être personnalisé dans certaines intégrations. Vous devez accéder au répertoire racine pour héberger un fichier de service de traitement.
Vous devez mettre à jour ces deux fichiers en coordination l’un avec l’autre pour qu’ils fonctionnent correctement.
Autres méthodes d’intégration
Pages mobiles accélérées (AMP)
See more
Étape 1 : Inclure le script de notification push pour le Web en AMP
Ajoutez la balise de script asynchrone suivante à votre en-tête :
1
<script async custom-element="amp-web-push" src="https://cdn.ampproject.org/v0/amp-web-push-0.1.js"></script>
Étape 2 : Ajouter des widgets d’abonnement
Ajoutez un widget dans le corps de votre HTML qui permet aux utilisateurs de s’abonner et de se désabonner de push.
1
2
3
4
5
6
7
8
9
<!-- A subscription widget -->
<amp-web-push-widget visibility="unsubscribed" layout="fixed" width="250" height="80">
<button on="tap:amp-web-push.subscribe">Subscribe to Notifications</button>
</amp-web-push-widget>
<!-- An unsubscription widget -->
<amp-web-push-widget visibility="subscribed" layout="fixed" width="250" height="80">
<button on="tap:amp-web-push.unsubscribe">Unsubscribe from Notifications</button>
</amp-web-push-widget>
Étape 3 : Ajoutez helper-iframe et permission-dialog
Le composant AMP Web Push crée une fenêtre contextuelle pour gérer les abonnements push. Vous devez donc ajouter les fichiers d’aide suivants à votre projet pour activer cette fonctionnalité :
Étape 4 : Créer un fichier de service de traitement
Créez un fichier service-worker.js dans le répertoire racine de votre site web et ajoutez l’extrait de code suivant :
Étape 5 : Configurer l’élément HTML des notifications push pour le Web en AMP
Ajoutez l’élément HTML amp-web-push suivant au corps de votre HTML. Gardez à l’esprit que vous devez ajouter vos apiKey et baseUrl en tant que paramètres de requête à service-worker-URL.
1
2
3
4
5
6
7
<amp-web-push
layout="nodisplay"
id="amp-web-push"
helper-iframe-url="FILE_PATH_TO_YOUR_HELPER_IFRAME"
permission-dialog-url="FILE_PATH_TO_YOUR_PERMISSION_DIALOG"
service-worker-url="FILE_PATH_TO_YOUR_SERVICE_WORKER?apiKey={YOUR_API_KEY}&baseUrl={YOUR_BASE_URL}"
>
Définition du module asynchrone (AMD)
Désactiver le soutien
Si votre site utilise RequireJS ou un autre chargeur de modules AMD, mais que vous préférez charger le SDK Braze via l’une des autres options de cette liste, vous pouvez charger une version de la bibliothèque qui n’inclut pas la prise en charge AMD. Il est possible de charger cette version de la bibliothèque depuis l’endroit suivant du CDN :
Chargeur de modules
Si vous utilisez RequireJS ou d’autres chargeurs de module AMD, nous vous recommandons d’auto-héberger une copie de notre bibliothèque et de la référencer comme vous le feriez avec d’autres ressources :
1
2
3
4
5
6
require(['path/to/braze.min.js'], function(braze) {
braze.initialize('YOUR-API-KEY-HERE', { baseUrl: 'YOUR-SDK-ENDPOINT' });
// Required if you want in-app messages to display automatically
braze.automaticallyShowInAppMessages();
braze.openSession();
});
Electron
Electron ne prend pas officiellement en charge les notifications push Web (voir ce problème GitHub). Il existe d’autres solutions de contournement open source que vous pouvez essayer mais qui n’ont pas été testées par Braze.
Cadre Jest
Lorsque vous utilisez Jest, vous pouvez visualiser une erreur similaire à SyntaxError: Unexpected token 'export'. Pour la réparer, ajustez votre configuration dans package.json pour ignorer le Braze SDK :
1
2
3
4
5
"jest": {
"transformIgnorePatterns": [
"/node_modules/(?!@braze)"
]
}
Cadres de la RSS
Si vous utilisez un cadre de rendu côté serveur (SSR) tel que Next.js, vous risquez de rencontrer des erreurs car le SDK est conçu pour être exécuté dans un environnement de navigateur. Vous pouvez résoudre ces problèmes en important le SDK de façon dynamique.
Vous pouvez conserver les bénéfices du nettoyage lorsque vous y procédez en exportant les parties du SDK dont vous avez besoin dans un fichier séparé et en important ensuite de façon dynamique ce fichier dans votre composant.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// MyComponent/braze-exports.js
// export the parts of the SDK you need here
export { initialize, openSession } from "@braze/web-sdk";
// MyComponent/MyComponent.js
// import the functions you need from the braze exports file
useEffect(() => {
import("./braze-exports.js").then(({ initialize, openSession }) => {
initialize("YOUR-API-KEY-HERE", {
baseUrl: "YOUR-SDK-ENDPOINT",
enableLogging: true,
});
openSession();
});
}, []);
Alternativement, si vous utilisez un pack Web pour regrouper votre application, vous pouvez tirer parti de ses commentaires magiques pour importer de façon dynamique uniquement les parties du SDK dont vous avez besoin.
1
2
3
4
5
6
7
8
9
10
11
12
13
// MyComponent.js
useEffect(() => {
import(
/* webpackExports: ["initialize", "openSession"] */
"@braze/web-sdk"
).then(({ initialize, openSession }) => {
initialize("YOUR-API-KEY-HERE", {
baseUrl: "YOUR-SDK-ENDPOINT",
enableLogging: true,
});
openSession();
});
}, []);
Tealium iQ
Tealium iQ propose une intégration de base de Braze. Pour configurer l’intégration, recherchez Braze dans l’interface Tealium Tag Management et fournissez la clé API du SDK pour le Web à partir de votre tableau de bord.
Pour plus de détails ou une assistance approfondie sur la configuration de Tealium, consultez notre documentation sur l’intégration ou contactez votre gestionnaire de compte Tealium.
Vite
Si vous utilisez Vite et voyez un avertissement autour des dépendances circulaires ou Uncaught TypeError: Class extends value undefined is not a constructor or null, vous pourriez devoir exclure le SDK de Braze de sa découverte de dépendance :
1
2
3
optimizeDeps: {
exclude: ['@braze/web-sdk']
},
Autres gestionnaires de balises
Braze peut également être compatible avec d’autres solutions de gestion des balises en suivant nos instructions d’intégration au sein d’une balise HTML personnalisée. Contactez un conseiller Braze si vous avez besoin d’aide pour évaluer ces solutions.
Intégration du SDK Android
Étape 1 : Mettez à jour votre build.gradle
Dans votre build.gradle, ajoutez mavenCentral() à votre liste de dépôts.
1
2
3
repositories {
mavenCentral()
}
Ensuite, ajoutez Braze à vos dépendances.
Si vous ne prévoyez pas d’utiliser les composants de l’interface utilisateur de Braze, ajoutez le code suivant à votre site build.gradle. Remplacez SDK_VERSION par la version actuelle de votre SDK Braze Android. Pour obtenir la liste complète des versions, consultez le journal des modifications.
1
2
3
4
dependencies {
implementation 'com.braze:android-sdk-base:SDK_VERSION' // (Required) Adds dependencies for the base Braze SDK.
implementation 'com.braze:android-sdk-location:SDK_VERSION' // (Optional) Adds dependencies for Braze location services.
}
Si vous prévoyez d’utiliser ultérieurement les composants de l’interface utilisateur de Braze, ajoutez le code suivant à votre site build.gradle. Remplacez SDK_VERSION par la version actuelle de votre SDK Braze Android. Pour obtenir la liste complète des versions, consultez le journal des modifications.
1
2
3
4
dependencies {
implementation 'com.braze:android-sdk-ui:SDK_VERSION' // (Required) Adds dependencies for the Braze SDK and Braze UI components.
implementation 'com.braze:android-sdk-location:SDK_VERSION' // (Optional) Adds dependencies for Braze location services.
}
Étape 2 : Configurez votre braze.xml
À partir de décembre 2019, les endpoints personnalisés ne sont plus fournis. Si vous disposez d’un endpoint personnalisé préexistant, vous pouvez continuer à l’utiliser. Pour plus de détails, consultez notre liste d’endpoints disponibles.
Créez un fichier braze.xml dans le dossier res/values de votre projet. Si vous êtes sur un cluster de données spécifique ou disposez d’un endpoint personnalisé préexistant, vous devez également spécifier l’endpoint dans votre fichier braze.xml.
Le contenu de ce fichier devrait ressembler à l’extrait de code suivant : Veillez à remplacer YOUR_APP_IDENTIFIER_API_KEY par l’identifiant figurant dans la page Gérer les paramètres du tableau de bord Braze. Connectez-vous à dashboard.braze.com pour trouver l’adresse de votre cluster.
1
2
3
4
5
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string translatable="false" name="com_braze_api_key">YOUR_APP_IDENTIFIER_API_KEY</string>
<string translatable="false" name="com_braze_custom_endpoint">YOUR_CUSTOM_ENDPOINT_OR_CLUSTER</string>
</resources>
Étape 3 : Ajoutez des autorisations à AndroidManifest.xml
Ensuite, ajoutez les permissions suivantes à votre AndroidManifest.xml:
1
2
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
Avec la sortie d’Android M, Android est passé d’un modèle d’autorisation de temps d’installation à un de temps d’exécution. Cependant, ces deux autorisations sont normales et accordées automatiquement si elles sont répertoriées dans le manifeste de l’application. Pour plus d’informations, consultez la documentation sur les autorisations d’Android.
Étape 4 : Activer l’initialisation différée (optionnel)
Pour utiliser l’initialisation différée, la version minimale du SDK de Braze est requise :
Lorsque l’initialisation différée est activée, toutes les connexions réseau sont annulées, ce qui empêche le SDK d’envoyer des données aux serveurs de Braze.
Étape 4.1 : Mettez à jour votre braze.xml
L’initialisation différée est désactivée par défaut. Pour l’activer, utilisez l’une des options suivantes :
Dans le fichier braze.xml de votre projet, définissez com_braze_enable_delayed_initialization comme true.
1
<bool name="com_braze_enable_delayed_initialization">true</bool>
Pour activer l’initialisation différée au moment de l’exécution, utilisez la méthode suivante.
1
Braze.enableDelayedInitialization(context);
1
Braze.enableDelayedInitialization(context)
Étape 4.2 : Configurer l’analyse/analytique push (facultatif)
Lorsque l’initialisation différée est activée, les analyses/analytiques push sont mises en file d’attente par défaut. Cependant, vous pouvez choisir de mettre explicitement en file d’attente ou d’abandonner l’ analyse/analytique push (si vous utilisez l’analyse/analytique push).
File d’attente explicite
Pour mettre explicitement en file d’attente l’analyse/analytique push, choisissez l’une des options suivantes :
Dans votre fichier braze.xml, définissez com_braze_delayed_initialization_analytics_behavior comme QUEUE:
1
<string name="com_braze_delayed_initialization_analytics_behavior">QUEUE</string>
Ajoutez QUEUE à votre Braze.enableDelayedInitialization() méthode :
1
Braze.enableDelayedInitialization(context, DelayedInitializationAnalyticsBehavior.QUEUE);
1
Braze.enableDelayedInitialization(context, DelayedInitializationAnalyticsBehavior.QUEUE)
Chute
Pour abandonner l’analyse/analytique push, choisissez l’une des options suivantes :
Dans votre fichier braze.xml, définissez com_braze_delayed_initialization_analytics_behavior comme DROP:
1
<string name="com_braze_delayed_initialization_analytics_behavior">DROP</string>
Ajoutez DROP à la Braze.enableDelayedInitialization() méthode :
1
Braze.enableDelayedInitialization(context, DelayedInitializationAnalyticsBehavior.DROP);
1
Braze.enableDelayedInitialization(context, DelayedInitializationAnalyticsBehavior.DROP)
Étape 4.3 : Initialiser manuellement le SDK
Après le délai que vous avez choisi, utilisez la méthode Braze.disableDelayedInitialization() pour initialiser manuellement le SDK.
1
Braze.disableDelayedInitialization(context);
1
Braze.disableDelayedInitialization(context)
Étape 5 : Activer le suivi de la session de l’utilisateur
Lorsque vous activez le suivi des sessions utilisateur, les appels à openSession(), closeSession(),ensureSubscribedToInAppMessageEvents()et InAppMessageManager peuvent être traités automatiquement.
Pour enregistrer les rappels de cycle de vie des activités, ajoutez le code suivant à la méthode onCreate() de votre classe Application.
1
2
3
4
5
6
7
public class MyApplication extends Application {
@Override
public void onCreate() {
super.onCreate();
registerActivityLifecycleCallbacks(new BrazeActivityLifecycleCallbackListener());
}
}
1
2
3
4
5
6
class MyApplication : Application() {
override fun onCreate() {
super.onCreate()
registerActivityLifecycleCallbacks(BrazeActivityLifecycleCallbackListener())
}
}
Pour la liste des paramètres disponibles, voir BrazeActivityLifecycleCallbackListener.
Tester le suivi de session
Vous pouvez également utiliser le débogueur SDK pour diagnostiquer les problèmes liés au SDK.
Si vous rencontrez des problèmes lors de vos tests, activez la journalisation en mode verbeux, puis utilisez logcat pour détecter les appels openSession et closeSession manquants dans vos activités.
- Dans Braze, allez dans Aperçu, sélectionnez votre application, puis dans le menu déroulant Afficher les données d’aperçu, choisissez Aujourd’hui.

- Ouvrez votre appli, puis actualisez le tableau de bord de Braze. Vérifiez que vos indicateurs ont augmenté de 1.
- Naviguez dans votre application et vérifiez qu’une seule session a été enregistrée sur Braze.
- Faites passer l’application en arrière-plan pendant au moins 10 secondes, puis ramenez-la au premier plan. Vérifiez qu’une nouvelle session a été enregistrée.
Configurations optionnelles
Configuration du temps d’exécution
Pour définir vos options Braze dans le code plutôt que dans votre fichier braze.xml, utilisez la configuration d’exécution. Si une valeur existe aux deux endroits, c’est la valeur d’exécution qui sera utilisée. Une fois que tous les paramètres requis ont été fournis au moment de l’exécution, vous pouvez supprimer votre fichier braze.xml.
Dans l’exemple suivant, un objet générateur est créé puis transmis à Braze.configure(). Notez que seules quelques-unes des options d’exécution disponibles sont affichées - reportez-vous à notre KDoc pour la liste complète.
1
2
3
4
5
6
7
8
BrazeConfig brazeConfig = new BrazeConfig.Builder()
.setApiKey("api-key-here")
.setCustomEndpoint("YOUR_CUSTOM_ENDPOINT_OR_CLUSTER")
.setSessionTimeout(60)
.setHandlePushDeepLinksAutomatically(true)
.setGreatNetworkDataFlushInterval(10)
.build();
Braze.configure(this, brazeConfig);
1
2
3
4
5
6
7
8
val brazeConfig = BrazeConfig.Builder()
.setApiKey("api-key-here")
.setCustomEndpoint("YOUR_CUSTOM_ENDPOINT_OR_CLUSTER")
.setSessionTimeout(60)
.setHandlePushDeepLinksAutomatically(true)
.setGreatNetworkDataFlushInterval(10)
.build()
Braze.configure(this, brazeConfig)
Vous cherchez un autre exemple ? Consultez notre exemple d’application Hello Braze.
ID publicitaire Google
L’identifiant publicitaire Google (GAID) est un identifiant publicitaire facultatif, spécifique à l’utilisateur, anonyme, unique et réinitialisable, fourni par les services Google Play. Le GAID permet aux utilisateurs de réinitialiser leur identifiant, de désactiver les publicités axées sur les centres d’intérêt dans les applications Google Play et de fournir aux développeurs un système simple et standard pour continuer à monétiser leurs applications.
L’ID publicitaire Google n’est pas automatiquement collecté par le SDK Braze et doit être défini manuellement via la méthode Braze.setGoogleAdvertisingId().
1
2
3
4
5
6
7
8
9
10
11
new Thread(new Runnable() {
@Override
public void run() {
try {
AdvertisingIdClient.Info idInfo = AdvertisingIdClient.getAdvertisingIdInfo(getApplicationContext());
Braze.getInstance(getApplicationContext()).setGoogleAdvertisingId(idInfo.getId(), idInfo.isLimitAdTrackingEnabled());
} catch (Exception e) {
e.printStackTrace();
}
}
}).start();
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
suspend fun fetchAndSetAdvertisingId(
context: Context,
scope: CoroutineScope = GlobalScope
) {
scope.launch(Dispatchers.IO) {
try {
val idInfo = AdvertisingIdClient.getAdvertisingIdInfo(context)
Braze.getInstance(context).setGoogleAdvertisingId(
idInfo.id,
idInfo.isLimitAdTrackingEnabled
)
} catch (e: Exception) {
e.printStackTrace()
}
}
}
Google exige que l’ID publicitaire soit collecté sur un fil non-IU.
Suivi de localisation
Pour activer la collecte d’emplacements/localisations de Braze, définissez com_braze_enable_location_collection comme true dans votre fichier braze.xml:
1
<bool name="com_braze_enable_location_collection">true</bool>
À partir de la version 3.6.0 du SDK Braze pour Android, le recueil des données de localisation Braze est désactivé par défaut.
Journalisation
Par défaut, le niveau de journalisation du SDK Android de Braze est défini sur INFO. Vous pouvez supprimer ces journaux ou définir un niveau de journal différent, tel que VERBOSE, DEBUG, ou WARN.
Activation des journaux
Pour faciliter la résolution des problèmes dans votre application ou réduire les délais de résolution des problèmes avec le service d’assistance de Braze, vous devez activer les journaux détaillés pour le SDK. Lorsque vous envoyez des journaux verbeux à l’assistance Braze, veillez à ce qu’ils commencent dès le lancement de votre application et se terminent bien après l’apparition de votre problème.
Gardez à l’esprit que les journaux verbeux ne sont destinés qu’à votre environnement de développement, et que vous devez donc les désactiver avant de rendre votre application publique.
Activez l’option “verbose logs” avant tout autre appel dans Application.onCreate() pour vous assurer que vos logs sont aussi complets que possible.
Pour activer les journaux directement dans votre application, ajoutez ce qui suit à la méthode onCreate() de votre application avant toute autre méthode.
1
BrazeLogger.setLogLevel(Log.MIN_LOG_LEVEL);
1
BrazeLogger.logLevel = Log.MIN_LOG_LEVEL
Remplacez MIN_LOG_LEVEL par la constante du niveau de journalisation que vous souhaitez définir comme niveau de journalisation minimum. Tous les journaux d’un niveau >= au MIN_LOG_LEVEL que vous avez défini seront transmis à la méthode Log par défaut d’Android. Tous les journaux < au MIN_LOG_LEVEL que vous avez défini seront rejetés.
| Constant | Valeur | Description |
|---|---|---|
VERBOSE |
2 | Enregistre les messages les plus détaillés pour le débogage et le développement. |
DEBUG |
3 | Enregistre des messages descriptifs pour le débogage et le développement. |
INFO |
4 | Enregistre des messages d’information pour les faits marquants. |
WARN |
5 | Enregistre les messages d’avertissement pour identifier les situations potentiellement dangereuses. |
ERROR |
6 | Enregistre les messages d’erreur pour indiquer les échecs de l’application ou les problèmes graves. |
ASSERT |
7 | Enregistre les messages d’assertion lorsque les conditions sont fausses pendant le développement. |
Par exemple, le code suivant transmettra les niveaux de journalisation 2, 3, 4, 5, 6 et 7 à la méthode Log.
1
BrazeLogger.setLogLevel(Log.VERBOSE);
1
BrazeLogger.logLevel = Log.VERBOSE
Pour activer les journaux dans le braze.xml, ajoutez ce qui suit à votre fichier :
1
<integer name="com_braze_logger_initial_log_level">MIN_LOG_LEVEL</integer>
Remplacez MIN_LOG_LEVEL par la valeur du niveau de journalisation que vous souhaitez définir comme niveau de journalisation minimum. Tous les journaux d’un niveau >= au MIN_LOG_LEVEL que vous avez défini seront transmis à la méthode Log par défaut d’Android. Tous les journaux < au MIN_LOG_LEVEL que vous avez défini seront rejetés.
| Constant | Valeur | Description |
|---|---|---|
VERBOSE |
2 | Enregistre les messages les plus détaillés pour le débogage et le développement. |
DEBUG |
3 | Enregistre des messages descriptifs pour le débogage et le développement. |
INFO |
4 | Enregistre des messages d’information pour les faits marquants. |
WARN |
5 | Enregistre les messages d’avertissement pour identifier les situations potentiellement dangereuses. |
ERROR |
6 | Enregistre les messages d’erreur pour indiquer les échecs de l’application ou les problèmes graves. |
ASSERT |
7 | Enregistre les messages d’assertion lorsque les conditions sont fausses pendant le développement. |
Par exemple, le code suivant transmettra les niveaux de journalisation 2, 3, 4, 5, 6 et 7 à la méthode Log.
1
<integer name="com_braze_logger_initial_log_level">2</integer>
Vérification des journaux de bord (verbose logs)
Pour vérifier que vos journaux sont définis sur VERBOSE, vérifiez si V/Braze apparaît quelque part dans vos journaux. Si c’est le cas, c’est que l’option de journalisation en mode verbeux a été activée avec succès. Par exemple :
1
2077-11-19 16:22:49.591 ? V/Braze v9.0.01 .bo.app.d3: Request started
Suppression des journaux
Pour supprimer tous les journaux pour le SDK Android de Braze, définissez le niveau de journal sur BrazeLogger.SUPPRESS dans la méthode onCreate() de votre application avant toute autre méthode.
1
BrazeLogger.setLogLevel(BrazeLogger.SUPPRESS);
1
BrazeLogger.setLogLevel(BrazeLogger.SUPPRESS)
Plusieurs clés API
Le cas d’usage le plus fréquent pour les clés API multiples est la séparation des clés API entre les variantes de version de débogage et de publication.
Pour basculer facilement entre plusieurs clés API dans vos versions, nous vous recommandons de créer un fichier braze.xml pour chaque variante de version pertinente. Une variante de version est une combinaison du type de version et de la variété du produit. Par défaut, les nouveaux projets Android sont créés avec les types de constructiondebug et release et sans aucun produit.
Pour chaque variante de création concernée, créez un nouveau site braze.xml dans le répertoire src/<build variant name>/res/values/. Lorsque la variante de version est compilée, elle utilisera la nouvelle clé API.
1
2
3
4
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="com_braze_api_key">REPLACE_WITH_YOUR_BUILD_VARIANT_API_KEY</string>
</resources>
Pour savoir comment configurer la clé API dans votre code, consultez la rubrique Configuration de l’exécution.
Message in-app exclusif TalkBack
Conformément aux directives d’accessibilité d’Android, le SDK Android de Braze propose par défaut Android Talkback. Pour vous assurer que seul le contenu des messages in-app est lu à haute voix, sans inclure d’autres éléments de l’écran tels que la barre de titre de l’application ou la navigation, vous pouvez activer le mode exclusif pour TalkBack.
Pour activer le mode exclusif pour les messages in-app :
1
<bool name="com_braze_device_in_app_message_accessibility_exclusive_mode_enabled">true</bool>
1
2
3
val brazeConfigBuilder = BrazeConfig.Builder()
brazeConfigBuilder.setIsInAppMessageAccessibilityExclusiveModeEnabled(true)
Braze.configure(this, brazeConfigBuilder.build())
1
2
3
BrazeConfig.Builder brazeConfigBuilder = new BrazeConfig.Builder()
brazeConfigBuilder.setIsInAppMessageAccessibilityExclusiveModeEnabled(true);
Braze.configure(this, brazeConfigBuilder.build());
R8 et ProGuard
La configuration de la réduction du code est automatiquement incluse dans votre intégration de Braze.
Les applications client qui obscurcissent le code Braze doivent stocker des fichiers de mappage de libération pour Braze afin d’interpréter les traces de pile. Si vous souhaitez continuer à conserver tous les codes Braze, ajoutez ce qui suit à votre fichier ProGuard :
1
2
-keep class bo.app.** { *; }
-keep class com.braze.** { *; }
Intégration du SDK Swift
Vous pouvez intégrer et personnaliser le SDK Swift à l’aide du gestionnaire de paquets swift (SPM), de CocoaPods ou de méthodes d’intégration manuelles. Pour plus d’informations sur les différents symboles du SDK, consultez la documentation de référence de Braze Swift.
Conditions préalables
Avant de commencer, vérifiez que votre environnement est pris en charge par la dernière version du SDK Braze Swift.
Étape 1 : Installez le SDK Swift de Braze
Nous vous recommandons d’utiliser le gestionnaire de paquets swift (SwiftPM ) ou CocoaPods pour installer le SDK Swift de Braze. Vous pouvez également installer le SDK manuellement.
Étape 1.1 : Importer la version SDK
Ouvrez votre projet et naviguez vers les paramètres de votre projet. Sélectionnez l’onglet Paquets Swift et cliquez sur le bouton d’ajout sous la liste des paquets.

À partir de la version 7.4.0, le SDK Braze Swift dispose de canaux de distribution supplémentaires sous la forme de XCFrameworks statiques et de XCFrameworks dynamiques. Si vous souhaitez utiliser l’un de ces formats à la place, suivez les instructions d’installation de leur dépôt respectif.
Saisissez l’URL de notre référentiel de SDK Swift iOS https://github.com/braze-inc/braze-swift-sdk dans le champ de texte. Dans la section Dependency Rule (Règle de dépendance), sélectionnez la version du SDK. Enfin, cliquez sur Ajouter un paquet.

Étape 1.2 : Sélectionnez vos paquets
Le SDK Swift de Braze sépare les fonctionnalités en bibliothèques autonomes pour offrir aux développeurs un meilleur contrôle sur les fonctionnalités à importer dans leurs projets.
| Offre | Détails |
|---|---|
BrazeKit |
Bibliothèque SDK principale avec prise en charge des analyses et des notifications push. |
BrazeLocation |
Bibliothèque de localisations avec prise en charge des analyses de localisation et de la surveillance des géorepérages. |
BrazeUI |
Bibliothèque d’interface utilisateur fournie par Braze pour les messages in-app, les cartes de contenu et les bannières. Importez cette bibliothèque si vous avez l’intention d’utiliser les composants d’interface utilisateur par défaut. |
À propos des bibliothèques de vulgarisation
BrazeNotificationService et BrazePushStory sont des modules d’extension qui fournissent des fonctionnalités supplémentaires et ne doivent pas être ajoutés directement à la cible de votre application principale. Suivez plutôt les guides liés pour les intégrer séparément dans leurs extensions cibles respectives.
| Offre | Détails |
|---|---|
BrazeNotificationService |
Bibliothèque d’extension du service de notification prenant en charge les notifications push riches. |
BrazePushStory |
Bibliothèque d’extension de contenu de notification fournissant un support pour les contenus push. |
Sélectionnez le paquet qui correspond le mieux à vos besoins et cliquez sur Ajouter un paquet. Veillez à sélectionner au moins BrazeKit.

Étape 1.1 : Installer CocoaPods
Pour une description complète, consultez le guide de démarrage de CocoaPods. Sinon, vous pouvez exécuter la commande suivante pour commencer rapidement :
1
$ sudo gem install cocoapods
Si vous êtes bloqué, consultez le guide de résolution des problèmes de CocoaPods.
Étape 1.2 : Construction du Podfile
Ensuite, créez un fichier dans votre répertoire de projet Xcode nommé Podfile.
À partir de la version 7.4.0, le SDK Braze Swift dispose de canaux de distribution supplémentaires sous la forme de XCFrameworks statiques et de XCFrameworks dynamiques. Si vous souhaitez utiliser l’un de ces formats à la place, suivez les instructions d’installation de leur dépôt respectif.
Ajoutez la ligne suivante à votre Podfile :
1
2
3
target 'YourAppTarget' do
pod 'BrazeKit'
end
BrazeKit contient la bibliothèque principale du SDK, avec la prise en charge des analyses et des notifications push.
Nous vous suggérons la version Braze afin que les mises à jour du pod récupèrent automatiquement tout ce qui est plus petit qu’une mise à jour mineure de la version. Cela ressemble à pod 'BrazeKit' ~> Major.Minor.Build. Si vous souhaitez intégrer automatiquement la dernière version de Braze SDK, même avec des modifications majeures, vous pouvez utiliser pod 'BrazeKit' dans votre Podfile.
A propos des bibliothèques supplémentaires
Le SDK Swift de Braze sépare les fonctionnalités en bibliothèques autonomes pour offrir aux développeurs un meilleur contrôle sur les fonctionnalités à importer dans leurs projets. En plus de BrazeKit, vous pouvez ajouter les bibliothèques suivantes à votre Podfile :
| Bibliothèque | Détails |
|---|---|
pod 'BrazeLocation' |
Bibliothèque de localisations avec prise en charge des analyses de localisation et de la surveillance des géorepérages. |
pod 'BrazeUI' |
Bibliothèque d’interface utilisateur fournie par Braze pour les messages in-app, les cartes de contenu et les bannières. Importez cette bibliothèque si vous avez l’intention d’utiliser les composants d’interface utilisateur par défaut. |
Bibliothèques d’extension
BrazeNotificationService et BrazePushStory sont des modules d’extension qui fournissent des fonctionnalités supplémentaires et ne doivent pas être ajoutés directement à la cible de votre application principale. Au lieu de cela, vous devrez créer des cibles d’extension distinctes pour chacun de ces modules et importer les modules Braze dans leurs cibles correspondantes.
| Bibliothèque | Détails |
|---|---|
pod 'BrazeNotificationService' |
Bibliothèque d’extension du service de notification prenant en charge les notifications push riches. |
pod 'BrazePushStory' |
Bibliothèque d’extension de contenu de notification fournissant un support pour les contenus push. |
Étape 1.3 : Installer le SDK
Pour installer le SDK Cocoapod Braze, accédez au répertoire de votre projet d’application Xcode au sein de votre terminal et exécutez la commande suivante :
1
pod install
À ce stade, vous devriez pouvoir ouvrir le nouvel espace de travail du projet Xcode créé par CocoaPods. Assurez-vous d’utiliser cet espace de travail Xcode au lieu de votre projet Xcode.

Mise à jour du SDK à l’aide de CocoaPods
Pour mettre à jour un Cocoapod, il vous suffit de lancer la commande suivante dans votre répertoire de projet :
1
pod update
Étape 1.1 : Téléchargez le SDK Braze
Accédez à la page du SDK Braze sur GitHub, puis téléchargez braze-swift-sdk-prebuilt.zip.

Étape 1.2 : Choisissez vos frameworks
Le SDK Swift Braze contient une série de XCFrameworks autonomes, ce qui vous donne la liberté d’intégrer les fonctionnalités que vous souhaitez sans avoir besoin de toutes les intégrer. Référez-vous au tableau suivant pour choisir vos XCFrameworks :
| Offre | Requis ? | Description |
|---|---|---|
BrazeKit |
Oui | Bibliothèque SDK principale avec prise en charge des analyses et des notifications push. |
BrazeLocation |
Non | Bibliothèque de localisations avec prise en charge des analyses de localisation et de la surveillance des géorepérages. |
BrazeUI |
Non | Bibliothèque d’interface utilisateur fournie par Braze pour les messages in-app, les cartes de contenu et les bannières. Importez cette bibliothèque si vous avez l’intention d’utiliser les composants d’interface utilisateur par défaut. |
BrazeNotificationService |
Non | Bibliothèque d’extension de service de notification qui fournit une prise en charge des notifications push enrichies. N’ajoutez pas cette bibliothèque directement à la cible de votre application principale, mais ajoutez plutôt la bibliothèque BrazeNotificationService séparément. |
BrazePushStory |
Non | Bibliothèque d’extension de contenu de notification qui fournit une prise en charge des Push Stories. N’ajoutez pas cette bibliothèque directement à la cible de votre application principale, mais ajoutez plutôt la bibliothèque BrazePushStory séparément. |
BrazeKitCompat |
Non | Bibliothèque de compatibilité contenant toutes les classes et méthodes Appboy et ABK* qui étaient disponibles dans le Appboy-iOS-SDK version 4.X.X. Pour plus de détails sur l’utilisation, reportez-vous au scénario de migration minimal dans le guide de migration. |
BrazeUICompat |
Non | Bibliothèque de compatibilité contenant toutes les classes et méthodes ABK* qui étaient disponibles dans la bibliothèque AppboyUI du Appboy-iOS-SDK version 4.X.X. Pour plus de détails sur l’utilisation, reportez-vous au scénario de migration minimal dans le guide de migration. |
SDWebImage |
Non | Dépendance utilisée uniquement par BrazeUICompat dans le scénario de migration minimal. |
Étape 1.3 : Préparez vos fichiers
Décidez si vous souhaitez utiliser des XCFrameworks statiques ou dynamiques, puis préparez vos fichiers :
- Créez un répertoire temporaire pour vos XCFrameworks.
- Dans
braze-swift-sdk-prebuilt, ouvrez le répertoiredynamicet déplacezBrazeKit.xcframeworkdans votre répertoire. Votre répertoire devrait être similaire à ce qui suit :1 2
temp_dir └── BrazeKit.xcframework
- Déplacez chacun de vos XCFrameworks choisis dans votre répertoire temporaire. Votre répertoire devrait être similaire à ce qui suit :
1 2 3 4 5
temp_dir ├── BrazeKit.xcframework ├── BrazeKitCompat.xcframework ├── BrazeLocation.xcframework └── SDWebImage.xcframework
Étape 1.4 : Intégrez vos frameworks
Ensuite, intégrez les XCFrameworks dynamiques ou statiques que vous avez préparés précédemment :
Dans votre projet Xcode, sélectionnez votre cible de build, puis Général. Sous Frameworks, bibliothèques et contenu intégré, faites glisser et déposez les fichiers que vous avez préparés précédemment.

À partir du SDK Swift 12.0.0, vous devez toujours sélectionner Embed & Sign pour les XCFrameworks de Braze, tant pour les variantes statiques que dynamiques. Cela permet de s’assurer que les ressources des frameworks sont correctement intégrées dans votre bundle d’application.
Pour activer la prise en charge du format GIF, ajoutez SDWebImage.xcframework, situé dans braze-swift-sdk-prebuilt/static ou braze-swift-sdk-prebuilt/dynamic.
Erreurs courantes pour les projets Objective-C
Si votre projet Xcode ne contient que des fichiers Objective-C, il se peut que vous obteniez des erreurs de « symbole manquant » lorsque vous essayez de créer votre projet. Pour corriger ces erreurs, ouvrez votre projet et ajoutez un fichier Swift vide à votre arborescence de fichiers. Ceci obligera votre chaîne d’outils de création à intégrer Swift Runtime et à lier les frameworks appropriés pendant le temps de création.
1
FILE_NAME.swift
Remplacez FILE_NAME par n’importe quelle chaîne sans espace. Votre fichier devrait ressembler à ce qui suit :
1
empty_swift_file.swift
Étape 2 : Configuration de l’initialisation différée (en option)
Vous pouvez choisir de retarder l’initialisation du SDK Braze Swift, ce qui est utile si votre application doit charger la configuration ou attendre le consentement de l’utilisateur avant de démarrer le SDK. L’initialisation différée garantit que les notifications push de Braze sont mises en file d’attente jusqu’à ce que le SDK soit prêt.
Pour ce faire, appelez Braze.prepareForDelayedInitialization() le plus tôt possible - idéalement à l’intérieur ou avant votre application(_:didFinishLaunchingWithOptions:).
Cela s’applique uniquement aux notifications push de Braze. Les autres notifications push sont gérées normalement par les délégués du système.
1
2
3
4
5
6
7
8
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
// Prepare the SDK for delayed initialization
Braze.prepareForDelayedInitialization()
// ... Additional non-Braze setup code
return true
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
@main
struct MyApp: App {
@UIApplicationDelegateAdaptor var appDelegate: AppDelegate
var body: some Scene {
WindowGroup {
ContentView()
}
}
}
class AppDelegate: NSObject, UIApplicationDelegate {
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey : Any]? = nil) -> Bool {
// Prepare the SDK for delayed initialization
Braze.prepareForDelayedInitialization()
// ... Additional non-Braze setup code
return true
}
}
1
2
3
4
5
6
7
8
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
// Prepare the SDK for delayed initialization
[Braze prepareForDelayedInitialization];
// ... Additional non-Braze setup code
return YES;
}
Braze.prepareForDelayedInitialization(pushAutomation:) accepte un paramètre facultatif pushAutomation. Si la valeur est nil, toutes les fonctionnalités d’automatisation du push sont activées, à l’exception de la demande d’autorisation du push au lancement.
Étape 3 : Mettre à jour la délégation de votre application
Ce qui suit suppose que vous avez déjà ajouté un AppDelegate à votre projet (qui n’est pas généré par défaut). Si vous ne prévoyez pas d’en utiliser un, veillez à initialiser le SDK de Braze le plus tôt possible, par exemple lors du lancement de l’application.
Ajoutez la ligne de code suivante à votre fichier AppDelegate.swift pour importer les fonctionnalités incluses dans le SDK Swift de Braze :
1
import BrazeKit
Ensuite, ajoutez une propriété statique à votre classe AppDelegate afin de conserver une référence forte à l’instance de Braze pendant toute la durée de vie de votre application :
1
2
3
class AppDelegate: UIResponder, UIApplicationDelegate {
static var braze: Braze? = nil
}
Enfin, dans AppDelegate.swift, ajoutez l’extrait de code suivant à votre méthode application:didFinishLaunchingWithOptions: :
1
2
3
4
5
6
let configuration = Braze.Configuration(
apiKey: "YOUR-APP-IDENTIFIER-API-KEY",
endpoint: "YOUR-BRAZE-ENDPOINT"
)
let braze = Braze(configuration: configuration)
AppDelegate.braze = braze
Mettez à jour YOUR-APP-IDENTIFIER-API-KEY et YOUR-BRAZE-ENDPOINT avec la valeur correcte à partir de la page Paramètres de l’application. Consultez nos types d’identifiants d’API pour plus d’informations sur l’endroit où trouver la clé API de votre identifiant d’appli.
Ajoutez la ligne de code suivante à votre fichier AppDelegate.m :
1
@import BrazeKit;
Ensuite, ajoutez une variable statique à votre fichier AppDelegate.m afin de conserver une référence à l’instance de Braze pendant toute la durée de vie de votre application :
1
2
3
4
5
6
7
8
9
10
11
static Braze *_braze;
@implementation AppDelegate
+ (Braze *)braze {
return _braze;
}
+ (void)setBraze:(Braze *)braze {
_braze = braze;
}
@end
Enfin, dans votre fichier AppDelegate.m, ajoutez l’extrait de code suivant dans votre méthode application:didFinishLaunchingWithOptions: :
1
2
3
4
BRZConfiguration *configuration = [[BRZConfiguration alloc] initWithApiKey:"YOUR-APP-IDENTIFIER-API-KEY"
endpoint:"YOUR-BRAZE-ENDPOINT"];
Braze *braze = [[Braze alloc] initWithConfiguration:configuration];
AppDelegate.braze = braze;
Mettez à jour YOUR-APP-IDENTIFIER-API-KEY et YOUR-BRAZE-ENDPOINT avec la valeur correcte à partir de votre page Gérer les paramètres. Consultez notre documentation sur l’API pour savoir où trouver la clé API de votre identifiant d’application.
Configurations optionnelles
Journalisation
Niveaux de journalisation
Le niveau de journalisation par défaut pour le SDK Braze Swift est .error- c’est également le niveau minimum pris en charge lorsque les journaux sont activés. Voici la liste complète des niveaux de journalisation :
| Swift | Objectif-C | Description |
|---|---|---|
.debug |
BRZLoggerLevelDebug |
Enregistrer les informations de débogage + .info + .error. |
.info |
BRZLoggerLevelInfo |
Enregistrer des informations générales sur le SDK (changements au niveau des utilisateurs, etc.) + .error. |
.error |
BRZLoggerLevelError |
Erreurs de journalisation. |
.disabled |
BRZLoggerLevelDisabled |
Aucun enregistrement n’a lieu. |
Réglage du niveau de journalisation
Vous pouvez attribuer le niveau de journalisation au moment de l’exécution dans votre objet Braze.Configuration. Pour plus de détails sur l’utilisation, voir Braze.Configuration.Logger.
1
2
3
4
5
6
7
let configuration = Braze.Configuration(
apiKey: "<BRAZE_API_KEY>",
endpoint: "<BRAZE_ENDPOINT>"
)
// Enable logging of general SDK information (such as user changes, etc.)
configuration.logger.level = .info
let braze = Braze(configuration: configuration)
1
2
3
4
5
BRZConfiguration *configuration = [[BRZConfiguration alloc] initWithApiKey:self.APIKey
endpoint:self.apiEndpoint];
// Enable logging of general SDK information (such as user changes, etc.)
[configuration.logger setLevel:BRZLoggerLevelInfo];
Braze *braze = [[Braze alloc] initWithConfiguration:configuration];
Intégration du SDK Cordova
Conditions préalables
Avant de commencer, vérifiez que votre environnement est pris en charge par la dernière version du SDK Braze Cordova.
Étape 1 : Ajoutez le SDK à votre projet
Ajoutez uniquement le SDK Braze Cordova à l’aide des méthodes ci-dessous. N’essayez pas d’effectuer l’installation en utilisant d’autres méthodes, car cela pourrait entraîner une violation de la sécurité.
Si vous utilisez Cordova 6 ou une version ultérieure, vous pouvez ajouter le SDK directement depuis GitHub. Vous pouvez également télécharger un ZIP du référentiel GitHub et ajouter le SDK manuellement.
Si vous ne prévoyez pas d’utiliser la collecte des localisations et les géorepérages, utilisez la branche master de GitHub.
1
cordova plugin add https://github.com/braze-inc/braze-cordova-sdk#master
Si vous prévoyez d’utiliser la collecte des localisations et les géorepérages, utilisez la geofence-branch de GitHub.
1
cordova plugin add https://github.com/braze-inc/braze-cordova-sdk#geofence-branch
Vous pouvez passer de master à geofence-branch à tout moment en répétant cette étape.
Étape 2 : Configurez votre projet
Ensuite, ajoutez les préférences suivantes à l’élément platform dans le fichier config.xml de votre projet.
1
2
<preference name="com.braze.ios_api_key" value="BRAZE_API_KEY" />
<preference name="com.braze.ios_api_endpoint" value="CUSTOM_API_ENDPOINT" />
1
2
<preference name="com.braze.android_api_key" value="BRAZE_API_KEY" />
<preference name="com.braze.android_api_endpoint" value="CUSTOM_API_ENDPOINT" />
Remplacez les éléments suivants :
| Valeur | Description |
|---|---|
BRAZE_API_KEY |
Votre clé API REST de Braze. |
CUSTOM_API_ENDPOINT |
Un endpoint d’API personnalisé. Cet endpoint est utilisé pour acheminer les données de votre instance Braze vers le groupe d’applications adéquat dans votre tableau de bord Braze. |
L’élément platform de votre fichier config.xml devrait ressembler à ce qui suit :
1
2
3
4
<platform name="ios">
<preference name="com.braze.ios_api_key" value="BRAZE_API_KEY" />
<preference name="com.braze.ios_api_endpoint" value="sdk.fra-01.braze.eu" />
</platform>
1
2
3
4
<platform name="android">
<preference name="com.braze.android_api_key" value="BRAZE_API_KEY" />
<preference name="com.braze.android_api_endpoint" value="sdk.fra-01.braze.eu" />
</platform>
Syntaxe spécifique à la plateforme
La section suivante couvre la syntaxe spécifique à la plateforme lorsque vous utilisez Cordova avec iOS ou Android.
Entiers
Les préférences entières sont lues comme des représentations de chaînes, comme dans l’exemple suivant :
1
2
3
4
<platform name="ios">
<preference name="com.braze.ios_flush_interval_seconds" value="10" />
<preference name="com.braze.ios_session_timeout" value="5" />
</platform>
En raison de la manière dont le framework Cordova 8.0.0+ gère les préférences, les préférences de nombres entiers uniquement (comme les identifiants d’expéditeur) doivent être définies sur des chaînes de caractères précédées de str_, comme dans l’exemple suivant :
1
2
3
4
<platform name="android">
<preference name="com.braze.android_fcm_sender_id" value="str_64422926741" />
<preference name="com.braze.android_default_session_timeout" value="str_10" />
</platform>
Booléens
Les préférences booléennes sont lues par le SDK en utilisant les mots-clés YES et NO comme une représentation sous forme de chaîne de caractères, comme dans l’exemple suivant :
1
2
3
4
<platform name="ios">
<preference name="com.braze.should_opt_in_when_push_authorized" value="YES" />
<preference name="com.braze.ios_disable_automatic_push_handling" value="NO" />
</platform>
Les préférences booléennes sont lues par le SDK en utilisant les mots-clés true et false comme une représentation sous forme de chaîne de caractères, comme dans l’exemple suivant :
1
2
3
4
<platform name="android">
<preference name="com.braze.should_opt_in_when_push_authorized" value="true" />
<preference name="com.braze.is_session_start_based_timeout_enabled" value="false" />
</platform>
Configurations optionnelles
Vous pouvez ajouter l’une des préférences suivantes à l’élément platform dans le fichier config.xml de votre projet :
| Méthode d’évaluation de la qualité de l’eau et de l’air | |
|---|---|
ios_api_key |
Définit la clé API pour votre application. |
ios_api_endpoint |
Définit le point d’endpoint du SDK pour votre application. |
ios_disable_automatic_push_registration |
Définit si l’enregistrement automatique de la poussée doit être désactivé. |
ios_disable_automatic_push_handling |
Définit si la gestion automatique des poussées doit être désactivée. |
ios_enable_idfa_automatic_collection |
Définit si le SDK de Braze doit collecter automatiquement les informations IDFA. Pour plus d’informations, consultez la documentation de la méthode IDFA de Braze. |
enable_location_collection |
Définit si la collecte automatique d’emplacement/localisation est activée (si l’utilisateur le permet). Le site geofence-branch |
geofences_enabled |
Définit si les géorepérages sont activés. |
ios_session_timeout |
Définit le délai d’attente de la session Braze pour votre application en secondes. La valeur par défaut est de 10 secondes. |
sdk_authentication_enabled |
Permet d’activer ou non la fonctionnalité d’authentification du SDK. |
display_foreground_push_notifications |
Définit si les notifications push doivent être affichées lorsque l’application est au premier plan. |
ios_disable_un_authorization_option_provisional |
Définit si UNAuthorizationOptionProvisional doit être désactivé. |
trigger_action_minimum_time_interval_seconds |
Définit l’intervalle de temps minimum en secondes entre les déclencheurs. La valeur par défaut est de 30 secondes. |
ios_push_app_group |
Définit l’ID du groupe d’applications pour les extensions push iOS. |
ios_forward_universal_links |
Définit si le SDK doit reconnaître et transmettre automatiquement les liens universels aux méthodes du système. |
ios_log_level |
Définit le niveau minimum de journalisation pour Braze.Configuration.Logger. |
ios_use_uuid_as_device_id |
Définit si un UUID généré aléatoirement doit être utilisé comme ID de l’appareil. |
ios_flush_interval_seconds |
Définit l’intervalle en secondes entre les vidanges automatiques des données. La valeur par défaut est de 10 secondes. |
ios_use_automatic_request_policy |
Définit si la politique de requête pour Braze.Configuration.Api doit être automatique ou manuelle. |
should_opt_in_when_push_authorized |
Définit si l’état de l’abonnement aux notifications d’un utilisateur doit être automatiquement défini sur optedIn lorsque les autorisations push sont autorisées. |
Pour plus d’informations détaillées, voir GitHub : Plug-in Cordova iOS Braze.
| Méthode d’évaluation de la qualité de l’eau et de l’air | |
|---|---|
android_api_key |
Définit la clé API pour votre application. |
android_api_endpoint |
Définit le point d’endpoint du SDK pour votre application. |
android_small_notification_icon |
Définit la petite icône de notification. |
android_large_notification_icon |
Définit la grande icône de notification. |
android_notification_accent_color |
Définit la couleur d’accentuation de la notification à l’aide d’une représentation hexadécimale. |
android_default_session_timeout |
Définit le délai d’attente de la session Braze pour votre application en secondes. La valeur par défaut est de 10 secondes. |
android_handle_push_deep_links_automatically |
Définit si le SDK de Braze doit gérer automatiquement les liens profonds de type “push”. |
android_log_level |
Définit le niveau de journalisation pour votre application. Le niveau de journalisation par défaut est de 4 et va enregistrer le minimum d’informations. Pour activer la journalisation verbeuse pour le débogage, utilisez le niveau de journalisation 2. |
firebase_cloud_messaging_registration_enabled |
Définit s’il faut utiliser Firebase Cloud Messaging pour les notifications push. |
android_fcm_sender_id |
Définit l’ID de l’expéditeur de Firebase Cloud Messaging. |
enable_location_collection |
Définit si la collecte automatique d’emplacement/localisation est activée (si l’utilisateur le permet). |
geofences_enabled |
Définit si les géorepérages sont activés. |
android_disable_auto_session_tracking |
Désactivez le plugin Android Cordova pour qu’il ne suive pas automatiquement les sessions. Pour plus d’informations, voir Désactiver le suivi automatique des sessions. |
sdk_authentication_enabled |
Permet d’activer ou non la fonctionnalité d’authentification du SDK. |
trigger_action_minimum_time_interval_seconds |
Définit l’intervalle de temps minimum en secondes entre les déclencheurs. La valeur par défaut est de 30 secondes. |
is_session_start_based_timeout_enabled |
Définit si le comportement du délai d’attente de la session doit être basé sur les événements de début ou de fin de session. |
default_notification_channel_name |
Définit le nom de l’utilisateur tel qu’il est vu via NotificationChannel.getName pour la valeur par défaut de Braze NotificationChannel. |
default_notification_channel_description |
Définit la description destinée à l’utilisateur telle qu’elle est vue via NotificationChannel.getDescription pour la valeur par défaut de Braze NotificationChannel. |
does_push_story_dismiss_on_click |
Définit si un contenu push est automatiquement supprimé lorsqu’on clique dessus. |
is_fallback_firebase_messaging_service_enabled |
Définit si l’utilisation d’un service d’envoi messages Cloud Firebase de secours est activée. |
fallback_firebase_messaging_service_classpath |
Définit le chemin d’accès pour le service d’envoi de messages Firebase Cloud de secours. |
is_content_cards_unread_visual_indicator_enabled |
Définit si la barre d’indication visuelle des cartes de contenu non lues est activée. |
is_firebase_messaging_service_on_new_token_registration_enabled |
Définit si le SDK de Braze enregistrera automatiquement les jetons dans com.google.firebase.messaging.FirebaseMessagingService.onNewToken. |
is_push_deep_link_back_stack_activity_enabled |
Définit si Braze ajoutera une activité à la pile arrière lors de la création automatique de liens profonds pour la poussée. |
push_deep_link_back_stack_activity_class_name |
Définit l’activité que Braze ajoutera à la pile arrière lors de la création automatique de liens profonds pour la poussée. |
should_opt_in_when_push_authorized |
Définit si Braze doit automatiquement procéder à l’abonnement de l’utilisateur lorsque le push est autorisé. |
Pour plus d’informations détaillées, voir GitHub : Plug-in Cordova Braze Android.
Voici un exemple de fichier config.xml avec des configurations supplémentaires :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<platform name="ios">
<preference name="com.braze.ios_disable_automatic_push_registration" value="NO"/"YES" />
<preference name="com.braze.ios_disable_automatic_push_handling" value="NO"/"YES" />
<preference name="com.braze.ios_enable_idfa_automatic_collection" value="YES"/"NO" />
<preference name="com.braze.enable_location_collection" value="NO"/"YES" />
<preference name="com.braze.geofences_enabled" value="NO"/"YES" />
<preference name="com.braze.ios_session_timeout" value="5" />
<preference name="com.braze.sdk_authentication_enabled" value="YES"/"NO" />
<preference name="com.braze.display_foreground_push_notifications" value="YES"/"NO" />
<preference name="com.braze.ios_disable_un_authorization_option_provisional" value="NO"/"YES" />
<preference name="com.braze.trigger_action_minimum_time_interval_seconds" value="30" />
<preference name="com.braze.ios_push_app_group" value="PUSH_APP_GROUP_ID" />
<preference name="com.braze.ios_forward_universal_links" value="YES"/"NO" />
<preference name="com.braze.ios_log_level" value="2" />
<preference name="com.braze.ios_use_uuid_as_device_id" value="YES"/"NO" />
<preference name="com.braze.ios_flush_interval_seconds" value="10" />
<preference name="com.braze.ios_use_automatic_request_policy" value="YES"/"NO" />
<preference name="com.braze.should_opt_in_when_push_authorized" value="YES"/"NO" />
</platform>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<platform name="android">
<preference name="com.braze.android_small_notification_icon" value="RESOURCE_ENTRY_NAME_FOR_ICON_DRAWABLE" />
<preference name="com.braze.android_large_notification_icon" value="RESOURCE_ENTRY_NAME_FOR_ICON_DRAWABLE" />
<preference name="com.braze.android_notification_accent_color" value="str_ACCENT_COLOR_INTEGER" />
<preference name="com.braze.android_default_session_timeout" value="str_SESSION_TIMEOUT_INTEGER" />
<preference name="com.braze.android_handle_push_deep_links_automatically" value="true"/"false" />
<preference name="com.braze.android_log_level" value="str_LOG_LEVEL_INTEGER" />
<preference name="com.braze.firebase_cloud_messaging_registration_enabled" value="true"/"false" />
<preference name="com.braze.android_fcm_sender_id" value="str_YOUR_FCM_SENDER_ID" />
<preference name="com.braze.enable_location_collection" value="true"/"false" />
<preference name="com.braze.geofences_enabled" value="true"/"false" />
<preference name="com.braze.android_disable_auto_session_tracking" value="true"/"false" />
<preference name="com.braze.sdk_authentication_enabled" value="true"/"false" />
<preference name="com.braze.trigger_action_minimum_time_interval_seconds" value="str_MINIMUM_INTERVAL_INTEGER" />
<preference name="com.braze.is_session_start_based_timeout_enabled" value="false"/"true" />
<preference name="com.braze.default_notification_channel_name" value="DEFAULT_NAME" />
<preference name="com.braze.default_notification_channel_description" value="DEFAULT_DESCRIPTION" />
<preference name="com.braze.does_push_story_dismiss_on_click" value="true"/"false" />
<preference name="com.braze.is_fallback_firebase_messaging_service_enabled" value="true"/"false" />
<preference name="com.braze.fallback_firebase_messaging_service_classpath" value="FALLBACK_FIREBASE_MESSAGING_CLASSPATH" />
<preference name="com.braze.is_content_cards_unread_visual_indicator_enabled" value="true"/"false" />
<preference name="com.braze.is_firebase_messaging_service_on_new_token_registration_enabled" value="true"/"false" />
<preference name="com.braze.is_push_deep_link_back_stack_activity_enabled" value="true"/"false" />
<preference name="com.braze.push_deep_link_back_stack_activity_class_name" value="DEEPLINK_BACKSTACK_ACTIVITY_CLASS_NAME" />
<preference name="com.braze.should_opt_in_when_push_authorized" value="true"/"false" />
</platform>
Désactiver le suivi automatique des sessions (Android uniquement)
Par défaut, le plugin Android Cordova assure automatiquement le suivi des sessions. Pour désactiver le suivi automatique des sessions, ajoutez la préférence suivante à l’élément platform du fichier config.xml de votre projet :
1
2
3
<platform name="android">
<preference name="com.braze.android_disable_auto_session_tracking" value="true" />
</platform>
Pour recommencer à suivre les sessions, appelez BrazePlugin.startSessionTracking(). Gardez à l’esprit que seules les sessions commencées après le prochain Activity.onStart() seront suivies.
À propos du SDK de Flutter Braze
Après avoir intégré le SDK Flutter de Braze sur Android et iOS, vous pourrez utiliser l’API de Braze au sein de vos applications Flutter écrites en Dart. Ce plug-in offre une fonctionnalité d’analytique de base et vous permet d’intégrer des messages in-app et des cartes de contenu pour iOS et Android à l’aide d’une base de code unique.
Intégration du SDK Flutter
Conditions préalables
Avant d’intégrer le SDK Flutter de Braze, vous devrez effectuer les opérations suivantes :
| Prérequis | Description |
|---|---|
| Identifiant de l’application API de Braze | Pour localiser l’identifiant de votre application, allez dans Emplacements > API et identifiants > Identifiants d’application. Pour plus d’informations, voir Types d’identifiants API. |
| Endpoint REST Braze | L’URL de votre endpoint REST. Votre endpoint dépendra de l’URL de Braze pour votre instance. |
| SDK Flutter | Installez le SDK officiel de Flutter et assurez-vous qu’il correspond à la version minimale prise en charge par le SDK de Braze Flutter. |
Étape 1 : Intégrez la bibliothèque Braze
Ajoutez le kit SDK Braze pour Flutter à partir de la ligne de commande. Cela ajoutera la ligne appropriée à votre pubspec.yaml.
1
flutter pub add braze_plugin
Étape 2 : Configuration complète du SDK natif
Pour vous connecter aux serveurs Braze, créez un fichier braze.xml dans le dossier android/res/values de votre projet. Collez le code suivant et remplacez la clé d’identification API et l’endpoint par vos valeurs :
1
2
3
4
5
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string translatable="false" name="com_braze_api_key">YOUR_APP_IDENTIFIER_API_KEY</string>
<string translatable="false" name="com_braze_custom_endpoint">YOUR_CUSTOM_ENDPOINT_OR_CLUSTER</string>
</resources>
Ajoutez les autorisations requises à votre fichier AndroidManifest.xml :
1
2
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
Ajoutez l’importation SDK Braze en haut du fichier AppDelegate.swift :
1
2
import BrazeKit
import braze_plugin
Dans le même fichier, créez l’objet de configuration Braze dans la méthode application(_:didFinishLaunchingWithOptions:) et remplacez la clé API et le endpoint par les valeurs de votre application. Ensuite, créez l’instance Braze à l’aide de la configuration et créez une propriété statique sur AppDelegate pour un accès facile :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
static var braze: Braze? = nil
override func application(
_ application: UIApplication,
didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey : Any]? = nil
) -> Bool {
// Setup Braze
let configuration = Braze.Configuration(
apiKey: "<BRAZE_API_KEY>",
endpoint: "<BRAZE_ENDPOINT>"
)
// - Enable logging or customize configuration here
configuration.logger.level = .info
let braze = BrazePlugin.initBraze(configuration)
AppDelegate.braze = braze
return true
}
Importez BrazeKit en haut du fichier AppDelegate.m :
1
@import BrazeKit;
Dans le même fichier, créez l’objet de configuration Braze dans la méthode application:didFinishLaunchingWithOptions: et remplacez la clé API et le endpoint par les valeurs de votre application. Ensuite, créez l’instance Braze à l’aide de la configuration et créez une propriété statique sur AppDelegate pour un accès facile :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
- (BOOL)application:(UIApplication *)application
didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
// Setup Braze
BRZConfiguration *configuration =
[[BRZConfiguration alloc] initWithApiKey:@"<BRAZE_API_KEY>"
endpoint:@"<BRAZE_ENDPOINT>"];
// - Enable logging or customize configuration here
configuration.logger.level = BRZLoggerLevelInfo;
Braze *braze = [BrazePlugin initBraze:configuration];
AppDelegate.braze = braze;
[self.window makeKeyAndVisible];
return YES;
}
#pragma mark - AppDelegate.braze
static Braze *_braze = nil;
+ (Braze *)braze {
return _braze;
}
+ (void)setBraze:(Braze *)braze {
_braze = braze;
}
Étape 3 : Configurer le plugin
Pour importer le plug-in dans votre code Dart, utilisez ce qui suit :
1
import 'package:braze_plugin/braze_plugin.dart';
Ensuite, initialisez une instance du plug-in Braze en appelant new BrazePlugin() comme dans notre exemple d’application.
Pour éviter les comportements indéfinis, n’allouez et n’utilisez qu’une seule instance de BrazePlugin dans votre code Dart.
Tester l’intégration
Vous pouvez vérifier que le SDK est intégré en consultant les statistiques de session dans le tableau de bord. Si vous exécutez votre application sur l’une ou l’autre plateforme, vous devriez voir une nouvelle session dans le tableau de bord (dans la section Aperçu ).
Ouvrez une session pour un utilisateur particulier en appelant le code suivant dans votre application.
1
2
BrazePlugin braze = BrazePlugin();
braze.changeUser("{some-user-id}");
Recherchez l’utilisateur avec {some-user-id} dans le tableau de bord sous Audience > Recherche d’utilisateurs. Vous pouvez y vérifier que les données de session et d’appareil ont été enregistrées.
À propos du SDK React Native de Braze
L’intégration du SDK React Native Braze fournit des fonctionnalités d’analyse/analytique de base et vous permet d’intégrer des messages in-app et des cartes de contenu pour iOS et Android avec une seule base de code.
Compatibilité avec la nouvelle architecture
La version minimale suivante du SDK est compatible avec toutes les apps utilisant la nouvelle architecture de React Native:
À partir de la version 6.0.0 du SDK, Braze utilise un module React Native Turbo, qui est compatible à la fois avec la nouvelle architecture et l’ancienne architecture de pont - ce qui signifie qu’aucune configuration supplémentaire n’est nécessaire.
Si votre app iOS est conforme à RCTAppDelegate et suit notre précédente configuration AppDelegate, passez en revue les exemples dans Complete native setup pour éviter tout plantage lors de l’abonnement à des événements dans le module Turbo.
Intégration du SDK React Native
Conditions préalables
Pour intégrer le SDK, la version 0.71 ou ultérieure de React Native est nécessaire. Pour obtenir la liste complète des versions prises en charge, consultez notre référentiel GitHub du SDK React Native.
Étape 1 : Intégrez la bibliothèque Braze
1
npm install @braze/react-native-sdk
1
yarn add @braze/react-native-sdk
Étape 2 : Choisissez une option de configuration
Vous pouvez gérer le SDK de Braze à l’aide du plugin Braze Expo ou via l’une des couches natives. Avec le plugin Expo, vous pouvez configurer certaines fonctionnalités du SDK sans écrire de code dans aucune des couches natives. Choisissez l’option qui répond le mieux aux besoins de votre application.
Étape 2.1 : Installer le plugin Braze Expo
Assurez-vous que votre version du SDK React Native de Braze correspond au minimum à 1.37.0. Pour obtenir la liste complète des versions prises en charge, consultez le référentiel React Native de Braze.
Pour installer le plugin Braze Expo, exécutez la commande suivante :
1
npx expo install @braze/expo-plugin
Étape 2.2 : Ajoutez le plug-in à votre app.json
Dans votre app.json, ajoutez le Plugin Braze Expo. Vous pouvez fournir les options de configuration suivantes :
| Méthode | Type | Description |
|---|---|---|
androidApiKey |
chaîne de caractères | Obligatoire. La clé API de votre application Android, située dans votre tableau de bord de Braze sous Gérer les paramètres. |
iosApiKey |
chaîne de caractères | Obligatoire. La clé API de votre application iOS, située dans votre tableau de bord de Braze sous Gérer les paramètres. |
baseUrl |
chaîne de caractères | Obligatoire. Le endpoint SDK de votre application, situé dans votre tableau de bord de Braze sous Gérer les paramètres. |
enableBrazeIosPush |
booléen | iOS uniquement. Si vous devez utiliser Braze pour gérer les notifications push sur iOS. Introduites dans le SDK React Native v1.38.0 et Expo Plugin v0.4.0. |
enableFirebaseCloudMessaging |
booléen | Android uniquement. Si vous devez utiliser Firebase Cloud Messaging pour les notifications push. Introduites dans le SDK React Native v1.38.0 et Expo Plugin v0.4.0. |
firebaseCloudMessagingSenderId |
chaîne de caractères | Android uniquement. Votre ID expéditeur Firebase Cloud Messaging. Introduites dans le SDK React Native v1.38.0 et Expo Plugin v0.4.0. |
sessionTimeout |
Entier | Le délai de session Braze pour votre application en secondes. |
enableSdkAuthentication |
booléen | Détermine si la fonctionnalité Authentification SDK est activée. |
logLevel |
Entier | Le niveau de journal pour votre application. Le niveau de journal par défaut est de 8 et va journaliser le minimum d’informations. Pour activer la journalisation verbeuse pour le débogage, utilisez le niveau 0 du journal. |
minimumTriggerIntervalInSeconds |
Entier | Intervalle minimum en secondes entre les déclenchements. 30 secondes par défaut. |
enableAutomaticLocationCollection |
booléen | Collecte des données de localisation automatique activée ou non (si l’utilisateur l’autorise). |
enableGeofence |
booléen | Activation ou non des géorepérages. |
enableAutomaticGeofenceRequests |
booléen | Demandes de géorepérage automatique ou non. |
dismissModalOnOutsideTap |
booléen | iOS uniquement. Le message in-app modal sera rejeté ou non lorsque l’utilisateur clique à l’extérieur du message in-app. |
androidHandlePushDeepLinksAutomatically |
booléen | Android uniquement. Si le SDK Braze doit gérer automatiquement les liens profonds de notification push. |
androidPushNotificationHtmlRenderingEnabled |
booléen | Android uniquement. Définit si le contenu textuel d’une notification push doit être interprété et rendu en tant que HTML en utilisant android.text.Html.fromHtml. |
androidNotificationAccentColor |
chaîne de caractères | Android uniquement. Définit la couleur d’accentuation de la notification Android. |
androidNotificationLargeIcon |
chaîne de caractères | Android uniquement. Définit l’icône large de la notification Android. |
androidNotificationSmallIcon |
chaîne de caractères | Android uniquement. Définit l’icône de notification petite d’Android. |
iosRequestPushPermissionsAutomatically |
booléen | iOS uniquement. Détermine si l’utilisateur doit être automatiquement invité à autoriser les notifications push au lancement de l’application. |
enableBrazeIosRichPush |
booléen | iOS uniquement. Faut-il activer les fonctionnalités push enrichies pour iOS. |
enableBrazeIosPushStories |
booléen | iOS uniquement. Activer ou non les histoires push Braze pour iOS. |
iosPushStoryAppGroup |
chaîne de caractères | iOS uniquement. Le groupe d’applications utilisé pour les histoires Push iOS. |
iosUseUUIDAsDeviceId |
booléen | iOS uniquement. Indique si l’ID de l’appareil utilisera un UUID généré de manière aléatoire. |
Exemple de configuration :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
{
"expo": {
"plugins": [
[
"@braze/expo-plugin",
{
"androidApiKey": "YOUR-ANDROID-API-KEY",
"iosApiKey": "YOUR-IOS-API-KEY",
"baseUrl": "YOUR-SDK-ENDPOINT",
"sessionTimeout": 60,
"enableGeofence": false,
"enableBrazeIosPush": false,
"enableFirebaseCloudMessaging": false,
"firebaseCloudMessagingSenderId": "YOUR-FCM-SENDER-ID",
"androidHandlePushDeepLinksAutomatically": true,
"enableSdkAuthentication": false,
"logLevel": 0,
"minimumTriggerIntervalInSeconds": 0,
"enableAutomaticLocationCollection": false,
"enableAutomaticGeofenceRequests": false,
"dismissModalOnOutsideTap": true,
"androidPushNotificationHtmlRenderingEnabled": true,
"androidNotificationAccentColor": "#ff3344",
"androidNotificationLargeIcon": "@drawable/custom_app_large_icon",
"androidNotificationSmallIcon": "@drawable/custom_app_small_icon",
"iosRequestPushPermissionsAutomatically": false,
"enableBrazeIosPushStories": true,
"iosPushStoryAppGroup": "group.com.example.myapp.PushStories"
}
],
]
}
}
Étape 2.3 : Créer et exécuter votre application
La préconstruction de votre application générera les fichiers natifs nécessaires au fonctionnement du plugin Braze Expo.
1
npx expo prebuild
Exécutez votre application tel qu’indiqué dans la documentation Expo. Gardez à l’esprit que si vous modifiez les options de configuration, vous devrez préconstruire et exécuter à nouveau l’application.
Étape 2.1 : Ajouter notre référentiel
Dans votre projet de niveau supérieur build.gradle, ajoutez ce qui suit sous buildscript > dependencies:
1
2
3
4
5
6
7
buildscript {
dependencies {
...
// Choose your Kotlin version
classpath("org.jetbrains.kotlin:kotlin-gradle-plugin:1.8.10")
}
}
Cela ajoutera Kotlin à votre projet.
Étape 2.2 : Configurer le SDK Braze
Pour vous connecter aux serveurs Braze, créez un fichier braze.xml dans le dossier res/values de votre projet. Collez le code suivant et remplacez la clé API et le point de terminaison par vos valeurs :
1
2
3
4
5
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string translatable="false" name="com_braze_api_key">YOU_APP_IDENTIFIER_API_KEY</string>
<string translatable="false" name="com_braze_custom_endpoint">YOUR_CUSTOM_ENDPOINT_OR_CLUSTER</string>
</resources>
Ajoutez les autorisations requises à votre fichier AndroidManifest.xml :
1
2
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
Avec la version 12.2.0 du SDK de Braze ou une version ultérieure, vous pouvez intégrer automatiquement la bibliothèque android-sdk-location en définissant importBrazeLocationLibrary=true dans votre fichier gradle.properties.
Étape 2.3 : Implémentez le suivi de session utilisateur
Les appels vers openSession() et closeSession() sont gérées automatiquement.
Ajoutez le code suivant à la méthode onCreate() de votre classe MainApplication :
1
2
3
4
5
6
7
8
import com.braze.BrazeActivityLifecycleCallbackListener;
@Override
public void onCreate() {
super.onCreate();
...
registerActivityLifecycleCallbacks(new BrazeActivityLifecycleCallbackListener());
}
1
2
3
4
5
6
7
import com.braze.BrazeActivityLifecycleCallbackListener
override fun onCreate() {
super.onCreate()
...
registerActivityLifecycleCallbacks(BrazeActivityLifecycleCallbackListener())
}
Étape 2.4 : Gérer les mises à jour d’intention
Si votre activité principale a android:launchMode défini sur singleTask, ajoutez le code suivant à votre classe MainActivity :
1
2
3
4
5
@Override
public void onNewIntent(Intent intent) {
super.onNewIntent(intent);
setIntent(intent);
}
1
2
3
4
override fun onNewIntent(intent: Intent) {
super.onNewIntent(intent)
setIntent(intent)
}
Étape 2.1 : (Facultatif) Configurer le Podfile pour les XCFrameworks dynamiques
Pour importer certaines bibliothèques Braze, telles que BrazeUI, dans un fichier Objective-C++, vous devrez utiliser la syntaxe #import. À partir de la version 7.4.0 du SDK Braze Swift, les binaires ont un canal de distribution facultatif sous forme de XCFrameworks dynamiques qui sont compatibles avec cette syntaxe.
Si vous souhaitez utiliser ce canal de distribution, remplacez manuellement les emplacements des sources CocoaPods dans votre Podfile. Référez-vous à l’exemple ci-dessous et remplacez {your-version} par la version pertinente que vous souhaitez importer :
1
2
3
pod 'BrazeKit', :podspec => 'https://raw.githubusercontent.com/braze-inc/braze-swift-sdk-prebuilt-dynamic/{your-version}/BrazeKit.podspec'
pod 'BrazeUI', :podspec => 'https://raw.githubusercontent.com/braze-inc/braze-swift-sdk-prebuilt-dynamic/{your-version}/BrazeUI.podspec'
pod 'BrazeLocation', :podspec => 'https://raw.githubusercontent.com/braze-inc/braze-swift-sdk-prebuilt-dynamic/{your-version}/BrazeLocation.podspec'
Étape 2.2 : Installer les pods
Comme React Native lie automatiquement les bibliothèques à la plateforme native, vous pouvez installer le SDK avec l’aide de CocoaPods.
Dans le dossier racine du projet :
1
2
3
4
5
# To install using the React Native New Architecture
cd ios && pod install
# To install using the React Native legacy architecture
cd ios && RCT_NEW_ARCH_ENABLED=0 pod install
Étape 2.3 : Configurer le SDK Braze
Ajoutez le SDK Braze en haut du fichier AppDelegate.swift :
1
2
import BrazeKit
import braze_react_native_sdk
Dans la méthode application(_:didFinishLaunchingWithOptions:), remplacez la clé API et le point de terminaison par les valeurs de votre application. Ensuite, créez l’instance Braze à l’aide de la configuration et créez une propriété statique sur AppDelegate pour un accès facile :
Notre exemple suppose une implémentation de RCTAppDelegate, qui fournit un certain nombre d’abstractions dans la configuration de React Native. Si vous utilisez une configuration différente pour votre application, assurez-vous d’ajuster votre implémentation en conséquence.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
func application(
_ application: UIApplication,
didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey : Any]? = nil
) -> Bool {
// Setup Braze
let configuration = Braze.Configuration(
apiKey: "{BRAZE_API_KEY}",
endpoint: "{BRAZE_ENDPOINT}")
// Enable logging and customize the configuration here.
configuration.logger.level = .info
let braze = BrazeReactBridge.perform(
#selector(BrazeReactBridge.initBraze(_:)),
with: configuration
).takeUnretainedValue() as! Braze
AppDelegate.braze = braze
/* Other configuration */
return true
}
// MARK: - AppDelegate.braze
static var braze: Braze? = nil
Ajoutez le SDK Braze en haut du fichier AppDelegate.m :
1
2
#import <BrazeKit/BrazeKit-Swift.h>
#import "BrazeReactBridge.h"
Dans la méthode application:didFinishLaunchingWithOptions:, remplacez la clé API et le point de terminaison par les valeurs de votre application. Ensuite, créez l’instance Braze à l’aide de la configuration et créez une propriété statique sur AppDelegate pour un accès facile :
Notre exemple suppose une implémentation de RCTAppDelegate, qui fournit un certain nombre d’abstractions dans la configuration de React Native. Si vous utilisez une configuration différente pour votre application, assurez-vous d’ajuster votre implémentation en conséquence.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
- (BOOL)application:(UIApplication *)application
didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
// Setup Braze
BRZConfiguration *configuration = [[BRZConfiguration alloc] initWithApiKey:@"{BRAZE_API_KEY}"
endpoint:@"{BRAZE_ENDPOINT}"];
// Enable logging and customize the configuration here.
configuration.logger.level = BRZLoggerLevelInfo;
Braze *braze = [BrazeReactBridge initBraze:configuration];
AppDelegate.braze = braze;
/* Other configuration */
return YES;
}
#pragma mark - AppDelegate.braze
static Braze *_braze = nil;
+ (Braze *)braze {
return _braze;
}
+ (void)setBraze:(Braze *)braze {
_braze = braze;
}
Étape 3 : Importer la bibliothèque
Ensuite, import la bibliothèque dans votre code React Native. Pour plus de détails, consultez notre exemple de projet.
1
import Braze from "@braze/react-native-sdk";
Étape 4 : Testez l’intégration (facultatif)
Pour tester votre intégration SDK, démarrez une nouvelle session sur l’une ou l’autre plateforme pour un utilisateur en appelant le code suivant dans votre application.
1
Braze.changeUser("userId");
Par exemple, vous pouvez attribuer l’ID utilisateur au démarrage de l’application :
1
2
3
4
5
6
7
8
9
10
11
12
13
import React, { useEffect } from "react";
import Braze from "@braze/react-native-sdk";
const App = () => {
useEffect(() => {
Braze.changeUser("some-user-id");
}, []);
return (
<div>
...
</div>
)
Dans le tableau de bord de Braze, allez dans Recherche d’utilisateurs et recherchez l’utilisateur dont l’ID correspond à some-user-id. Ici, vous pouvez vérifier que les données relatives à la session et à l’appareil ont été enregistrées.
Intégration du SDK Roku
Étape 1 : Ajouter des fichiers
Les fichiers du SDK Braze sont disponibles dans le répertoire sdk_files du référentiel SDK Roku de Braze.
- Ajouter
BrazeSDK.brsà votre application dans le répertoiresource. - Ajouter
BrazeTask.brsetBrazeTask.xmlà votre application dans le répertoirecomponents.
Étape 2 : Ajouter des références
Ajouter une référence à BrazeSDK.brs dans votre scène principale, en utilisant l’élément script :
1
<script type="text/brightscript" uri="pkg:/source/BrazeSDK.brs"/>
Étape 3 : Configurer
Dans main.brs, définissez la configuration Braze sur le nœud global :
1
2
3
4
5
6
7
8
globalNode = screen.getGlobalNode()
config = {}
config_fields = BrazeConstants().BRAZE_CONFIG_FIELDS
config[config_fields.API_KEY] = {YOUR_API_KEY}
' example endpoint: "https://sdk.iad-01.braze.com/"
config[config_fields.ENDPOINT] = {YOUR_ENDPOINT}
config[config_fields.HEARTBEAT_FREQ_IN_SECONDS] = 5
globalNode.addFields({brazeConfig: config})
Vous trouverez votre endpoint SDK et votre clé API dans le tableau de bord de Braze.
Étape 4 : Initialiser Braze
Initialiser l’instance Braze :
1
2
m.BrazeTask = createObject("roSGNode", "BrazeTask")
m.Braze = getBrazeInstance(m.BrazeTask)
Configurations optionnelles
Journalisation
Pour déboguer votre intégration Braze, vous pouvez afficher la console de débogage Roku pour les journaux Braze. Pour en savoir plus, reportez-vous au Code de débogage des développeurs Roku.
À propos du SDK d’Unity Braze
Pour obtenir la liste complète des types, fonctions, variables et autres, consultez le fichier de déclaration d’Unity. En outre, si vous avez déjà intégré Unity manuellement pour iOS, vous pouvez passer à une intégration automatisée à la place.
Intégration du SDK Unity
Conditions préalables
Avant de commencer, vérifiez que votre environnement est pris en charge par la dernière version du SDK Braze Unity.
Étape 1 : Choisissez votre package Braze Unity
Le .unitypackage Braze regroupe des liaisons natives pour les plateformes Android et iOS, ainsi qu’une interface C#.
Plusieurs paquets de Braze Unity peuvent être téléchargés sur la page des versions de Braze Unity:
Appboy.unitypackage- Ce package regroupe les SDK Android et iOS Braze et la dépendance SDWebImage du SDK iOS, nécessaire pour le fonctionnement approprié des messages in-app de Braze et des fonctionnalités de cartes de contenu sur iOS. L’infrastructure SDWebImage est utilisée pour télécharger et afficher des images, y compris des GIF. Si vous avez l’intention d’utiliser la fonctionnalité Braze dans son intégralité, téléchargez et importez ce package.
Appboy-nodeps.unitypackage- Ce package est similaire à
Appboy.unitypackage, à l’exception du framework SDWebImage qui n’est pas présent. Ce package est utile si vous ne souhaitez pas que l’infrastructure SDWebImage soit présente dans votre application iOS.
- Ce package est similaire à
À partir d’Unity 2.6.0, l’artefact groupé du SDK Braze Android nécessite les dépendances AndroidX. Si vous utilisiez auparavant un jetified unitypackage, alors vous pouvez effectuer une transition en toute sécurité vers le unitypackage correspondant.
Le .unitypackage Braze regroupe des liaisons natives pour les plateformes Android et iOS, ainsi qu’une interface C#.
Le package Braze Unity est disponible au téléchargement sur la page des versions de Braze Unity avec deux options d’intégration :
Appboy.unitypackageuniquement- Ce paquet regroupe les SDK Android et iOS de Braze sans aucune dépendance supplémentaire. Cette méthode d’intégration ne permet pas d’utiliser pleinement l’envoi de messages in-app et les fonctionnalités de cartes de contenu de Braze sur iOS. Si vous avez l’intention d’utiliser toutes les fonctionnalités de Braze sans code personnalisé, utilisez plutôt l’option ci-dessous.
- Pour utiliser cette option d’intégration, assurez-vous que la case à côté de
Import SDWebImage dependencyest décochée dans l’interface utilisateur Unity sous Configuration Braze.
Appboy.unitypackageavecSDWebImage- Cette option d’intégration regroupe les SDK Android et iOS de Braze et la dépendance SDwebimage pour le SDK iOS, qui est nécessaire au bon fonctionnement de la messagerie in-app de Braze, et des fonctionnalités des cartes de contenu sur iOS. Le cadre
SDWebImageest utilisé pour télécharger et afficher des images, y compris des GIF. Si vous avez l’intention d’utiliser la fonctionnalité Braze dans son intégralité, téléchargez et importez ce package. - Pour importer automatiquement
SDWebImage, veillez à cocher la case à côté deImport SDWebImage dependencydans l’interface utilisateur Unity sous Configuration Braze.
- Cette option d’intégration regroupe les SDK Android et iOS de Braze et la dépendance SDwebimage pour le SDK iOS, qui est nécessaire au bon fonctionnement de la messagerie in-app de Braze, et des fonctionnalités des cartes de contenu sur iOS. Le cadre
Pour savoir si vous avez besoin de la dépendance SDWebimage pour votre projet iOS, consultez la documentation sur les messages in-app d’iOS.
Étape 2 : Importer le package
Dans Unity Editor, importez le package dans votre projet Unity en sélectionnant Actifs > Importer un package > Personnaliser le package. Cliquez ensuite sur Importer.
Vous pouvez également suivre les instructions pour Importer un package d’actifs Unity pour accéder à un guide plus détaillé sur l’importation des packages Unity personnalisés.
Si vous souhaitez importer le plug-in iOS ou Android uniquement, désélectionnez le sous-répertoire Plugins/Android ou Plugins/iOS lors de l’importation du Braze .unitypackage.
Dans Unity Editor, importez le package dans votre projet Unity en sélectionnant Actifs > Importer un package > Personnaliser le package. Cliquez ensuite sur Importer.
Vous pouvez également suivre les instructions pour Importer un package d’actifs Unity pour accéder à un guide plus détaillé sur l’importation des packages Unity personnalisés.
Si vous souhaitez importer le plug-in iOS ou Android uniquement, désélectionnez le sous-répertoire Plugins/Android ou Plugins/iOS lors de l’importation du Braze .unitypackage.
Étape 3 : Configurer le SDK
Étape 3.1 : Configurer AndroidManifest.xml
Pour remplir AndroidManifest.xml de fonctionner. Si votre application n’a pas de AndroidManifest.xml, vous pouvez utiliser ce qui suit comme modèle. Sinon, si vous avez déjà un AndroidManifest.xml, assurez-vous que l’une des sections manquantes suivantes est ajoutée à votre AndroidManifest.xml existant.
- Allez dans le répertoire
Assets/Plugins/Android/et ouvrez votre fichierAndroidManifest.xml. Il s’agit de l’emplacement/localisation par défaut dans l’éditeur Unity. - Dans votre site
AndroidManifest.xml, ajoutez les permissions et activités requises dans le modèle suivant. - Lorsque vous aurez terminé, votre site
AndroidManifest.xmlne devrait contenir qu’une seule activité avec"android.intent.category.LAUNCHER".
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="REPLACE_WITH_YOUR_PACKAGE_NAME">
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<application android:icon="@drawable/app_icon"
android:label="@string/app_name">
<!-- Calls the necessary Braze methods to ensure that analytics are collected and that push notifications are properly forwarded to the Unity application. -->
<activity android:name="com.braze.unity.BrazeUnityPlayerActivity"
android:theme="@style/UnityThemeSelector"
android:label="@string/app_name"
android:configChanges="fontScale|keyboard|keyboardHidden|locale|mnc|mcc|navigation|orientation|screenLayout|screenSize|smallestScreenSize|uiMode|touchscreen"
android:screenOrientation="sensor">
<meta-data android:name="android.app.lib_name" android:value="unity" />
<meta-data android:name="unityplayer.ForwardNativeEventsToDalvik" android:value="true" />
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<!-- A Braze specific FirebaseMessagingService used to handle push notifications. -->
<service android:name="com.braze.push.BrazeFirebaseMessagingService"
android:exported="false">
<intent-filter>
<action android:name="com.google.firebase.MESSAGING_EVENT" />
</intent-filter>
</service>
</application>
</manifest>
Toutes les classes d’activité enregistrées dans votre fichier AndroidManifest.xml doivent être pleinement intégrées au SDK Android de Braze, sinon vos analyses/analytiques ne seront pas collectées. Si vous ajoutez votre propre classe d’activité, veillez à étendre le lecteur Braze Unity afin d’éviter ce problème.
Étape 3.2 : Mettez à jour AndroidManifest.xml avec le nom de votre paquet
Pour trouver le nom de votre paquet, cliquez sur Fichier > Paramètres de création > Paramètres du lecteur > Onglet Android.

Dans votre AndroidManifest.xml, toutes les instances de REPLACE_WITH_YOUR_PACKAGE_NAME doivent être remplacées par Package Name par rapport à l’étape précédente.
Étape 3.3 : Ajouter les dépendances gradle
Pour ajouter des dépendances gradle à votre projet Unity, activez d’abord “Custom Main Gradle Template” dans vos paramètres de publication. Ceci créera un modèle gradle que votre projet utilisera. Un fichier gradle gère la mise en place des dépendances et d’autres paramètres du projet au moment de la création. Pour plus d’informations, consultez l’exemple d’application Braze Unity à la rubrique mainTemplate.gradle.
Les dépendances suivantes sont requises :
1
2
3
4
5
6
implementation 'com.google.firebase:firebase-messaging:22.0.0'
implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.1.0"
implementation "androidx.recyclerview:recyclerview:1.2.1"
implementation "org.jetbrains.kotlin:kotlin-stdlib:1.6.0"
implementation "org.jetbrains.kotlinx:kotlinx-coroutines-android:1.6.1"
implementation 'androidx.core:core:1.6.0'
Vous pouvez également définir ces dépendances à l’aide du gestionnaire de dépendances externes.
Étape 3.4 : Automatiser l’intégration d’Unity dans Android
Braze fournit une solution Unity native pour l’automatisation de l’intégration Unity Android.
- Dans Unity Editor, ouvrez les paramètres de configuration de Braze en sélectionnant Braze > Configuration Braze.
- Cochez la case Automatiser l’intégration d’Unity Android.
- Dans le champ Clé API Braze, saisissez la clé API de votre application qui se trouve dans Gérer les paramètres depuis le tableau de bord de Braze.
Cette intégration automatique ne doit pas être utilisée avec un fichier braze.xml créé manuellement, car les valeurs de configuration peuvent entrer en conflit pendant le projet. Si vous avez besoin d’un braze.xml manuel, désactivez l’intégration automatique.
Étape 3.1 : Définir votre clé API
Braze fournit une solution Unity native pour l’automatisation de l’intégration Unity iOS. Cette solution modifie le projet Xcode conçu à l’aide du PostProcessBuildAttribute et des sous-classes UnityAppController de Unity avec la macro IMPL_APP_CONTROLLER_SUBCLASS.
- Dans Unity Editor, ouvrez les paramètres de configuration de Braze en sélectionnant Braze > Configuration Braze.
- Cochez la case Automatiser l’intégration d’Unity iOS.
- Dans le champ Clé API Braze, saisissez la clé API de votre application qui se trouve dans Gérer les paramètres.

Si votre application utilise déjà une autre sous-classe UnityAppController, vous devrez fusionner votre implémentation de sous-classe avec AppboyAppDelegate.mm.
Personnaliser le package Unity
Étape 1 : Cloner le dépôt
Dans votre terminal, clonez le dépôt GitHub Braze Unity SDK, puis naviguez jusqu’à ce dossier :
1
2
git clone [email protected]:braze-inc/braze-unity-sdk.git
cd ~/PATH/TO/DIRECTORY/braze-unity-sdk
1
2
git clone git@github.com:braze-inc/braze-unity-sdk.git
cd C:\PATH\TO\DIRECTORY\braze-unity-sdk
Étape 2 : Exporter un paquet à partir d’un référentiel
Tout d’abord, lancez Unity et laissez-le tourner en arrière-plan. Ensuite, à la racine du référentiel, exécutez la commande suivante pour exporter le paquet vers braze-unity-sdk/unity-package/.
1
/Applications/Unity/Unity.app/Contents/MacOS/Unity -batchmode -nographics -projectPath "$(pwd)" -executeMethod Appboy.Editor.Build.ExportAllPackages -quit
1
"%UNITY_PATH%" -batchmode -nographics -projectPath "%PROJECT_ROOT%" -executeMethod Appboy.Editor.Build.ExportAllPackages -quit
Si vous rencontrez des problèmes après avoir exécuté ces commandes, consultez Unity : Arguments de la ligne de commande.
Étape 3 : Importer le paquet dans Unity
- Dans Unity, importez le paquet souhaité dans votre projet Unity en naviguant vers Assets > Import Package > Custom Package.
- S’il y a des fichiers que vous ne voulez pas importer, désélectionnez-les maintenant.
- Personnalisez le paquet Unity exporté, situé à l’emplacement/localisation
Assets/Editor/Build.cs.
Passer à une intégration automatisée (Swift uniquement)
Pour profiter de l’intégration automatisée iOS proposée dans le SDK Unity de Braze, suivez ces étapes pour passer d’un mode manuel à une intégration automatisée.
- Supprimez tous les codes liés à Braze de votre sous-classe
UnityAppControllerde projet Xcode. - Supprimez les bibliothèques iOS de Braze de votre projet Unity ou Xcode (telles que
Appboy_iOS_SDK.frameworketSDWebImage.framework). - Importez à nouveau le paquet Braze Unity dans votre projet. Pour une description complète, voir Étape 2 : Importez le paquet.
- Définissez à nouveau votre clé API. Pour une description complète, voir Étape 3.1 : Définissez votre clé API.
Configurations optionnelles
Consignation prolixe
Pour activer la journalisation verbeuse dans l’éditeur Unity, procédez comme suit :
- Ouvrez les paramètres de configuration de Braze en sélectionnant Braze > Configuration de Braze.
- Cliquez sur le menu déroulant Afficher les paramètres Android de Braze.
- Dans le champ Niveau de journalisation du SDK, saisissez la valeur 0.
Compatibilité Prime 31
Pour utiliser le plug-in Unity de Braze avec les plug-ins Prime31, modifiez le AndroidManifest.xml de votre projet pour utiliser les classes d’activité compatibles Prime31. Modifier toutes les références de
com.braze.unity.BrazeUnityPlayerActivity vers com.braze.unity.prime31compatible.BrazeUnityPlayerActivity
Amazon Device Messaging (ADM)
Braze prend en charge l’intégration d’ADM push dans les applications Unity. Si vous souhaitez intégrer ADM push, créez un fichier appelé api_key.txt contenant votre clé API ADM et placez-le dans le dossier Plugins/Android/assets/. Pour plus d’informations sur l’intégration d’ADM avec Braze, consultez nos instructions d’intégration d’ADM push.
Extension du lecteur Braze Unity (Android uniquement)
L’exemple de fichier AndroidManifest.xml fourni contient une classe d’activité enregistrée, BrazeUnityPlayerActivity. Cette classe est intégrée au SDK Braze et étend UnityPlayerActivity à la gestion des sessions, l’enregistrement des messages in-app, la journalisation des analyses des notifications push et bien plus encore. Voir Unity pour plus d’informations sur l’extension de la classe UnityPlayerActivity.
Si vous créez votre propre UnityPlayerActivity dans un projet de bibliothèque ou de plugin, vous devrez étendre notre BrazeUnityPlayerActivity pour intégrer votre fonctionnalité personnalisée avec Braze. Avant de commencer à travailler sur l’extension BrazeUnityPlayerActivity, suivez nos instructions pour intégrer Braze dans votre projet Unity.
- Ajoutez le SDK Android de Braze en tant que dépendance à votre bibliothèque ou à votre projet de plug-in comme décrit dans les instructions d’intégration du SDK Android de Braze.
- Intégrez notre
.aarUnity, qui contient notre fonctionnalité spécifique à Unity, à votre projet de bibliothèque Android que vous constituez pour Unity. Leappboy-unity.aarest disponible dans notre dépôt public. Une fois que notre bibliothèque Unity a été intégrée avec succès, modifiez votreUnityPlayerActivitypour étendreBrazeUnityPlayerActivity. - Exportez votre bibliothèque ou votre projet de plug-in et déposez-le dans
/<your-project>/Assets/Plugins/Androidde manière habituelle. N’incluez pas de code source Braze dans votre bibliothèque ou votre plug-in, car ils seront déjà présents dans/<your-project>/Assets/Plugins/Android. - Modifier votre
/<your-project>/Assets/Plugins/Android/AndroidManifest.xmlpour spécifier votre sous-classeBrazeUnityPlayerActivitycomme activité principale.
Vous devriez maintenant pouvoir mettre en package un .apk depuis l’IDE Unity qui est entièrement intégré à Braze et contient votre fonctionnalité UnityPlayerActivity personnalisée.
Résolution des problèmes
Erreur : “Le fichier n’a pas pu être lu
Les erreurs ressemblant à ce qui suit peuvent être ignorées en toute sécurité. Le logiciel Apple utilise une extension PNG exclusive appelée CgBI, qu’Unity ne reconnaît pas. Ces erreurs n’affecteront ni votre iOS ni l’affichage approprié des images associées dans le paquet Braze.
1
Could not create texture from Assets/Plugins/iOS/AppboyKit/Appboy.bundle/...png: File could not be read
Intégration du SDK .NET MAUI
L’intégration du SDK .NET MAUI (anciennement Xamarin) de Braze vous fournira une fonctionnalité d’analyse/analytique de base ainsi que des messages in-app fonctionnels avec lesquels vous pourrez engager vos utilisateurs.
Conditions préalables
Avant de pouvoir intégrer le SDK .NET MAUI Braze, assurez-vous que vous remplissez les conditions suivantes :
- À partir de la
version 3.0.0, ce SDK nécessite l’utilisation de .NET 6+ et supprime la prise en charge des projets utilisant le framework Xamarin. - À partir de
version 4.0.0, ce SDK a abandonné la prise en charge de Xamarin & Xamarin.Forms et a ajouté la prise en charge de .NET MAUI. Voir la politique de Microsoft concernant la fin du support pour Xamarin.
Étape 1 : Obtenir la liaison .NET MAUI
Une liaison .NET MAUI est un moyen d’utiliser des bibliothèques natives dans des applications .NET MAUI. L’implémentation d’une liaison consiste à créer une interface C# avec la bibliothèque, puis à utiliser cette interface dans votre application. Voir la documentation .NET MAUI. Il existe deux façons d’inclure la liaison du SDK de Braze : en utilisant NuGet ou en compilant à partir de la source.
La méthode d’intégration la plus simple consiste à obtenir le SDK de Braze à partir du référentiel central NuGet.org. Dans la barre latérale Visual Studio, cliquez avec le bouton droit de la souris le dossier Packages et cliquez sur Add Packages.... Recherchez « Braze » et installez le package BrazePlatform.BrazeAndroidBinding dans votre projet.
La deuxième méthode d’intégration consiste à inclure la source de liaison. Sous appboy-component/src/androidnet6 vous trouverez le code source de notre binding ; en ajoutant une référence de projet à BrazeAndroidBinding.csproj dans votre application .NET MAUI, le binding sera créé avec votre projet et vous aurez accès au SDK Android de Braze.
Les liaisons iOS pour la version 4.0.0 du SDK .NET MAUI et les versions ultérieures utilisent le SDK Swift de Braze, tandis que les versions précédentes utilisent l’ancien SDK AppboyKit.
Une liaison .NET MAUI est un moyen d’utiliser des bibliothèques natives dans des applications .NET MAUI. L’implémentation d’une liaison consiste à créer une interface C# avec la bibliothèque, puis à utiliser cette interface dans votre application. Il existe deux façons d’inclure la liaison du SDK de Braze : en utilisant NuGet ou en compilant à partir de la source.
La méthode d’intégration la plus simple consiste à obtenir le SDK de Braze à partir du référentiel central NuGet.org. Dans la barre latérale Visual Studio, cliquez avec le bouton droit de la souris le dossier Packages et cliquez sur Add Packages.... Recherchez ‘Braze’ et installez les derniers paquets NuGet .NET MAUI iOS : Braze.iOS.BrazeKit, Braze.iOS.BrazeUI, et Braze.iOS.BrazeLocation dans votre projet.
Nous fournissons également les packages de bibliothèques de compatibilité : Braze.iOS.BrazeKitCompat et Braze.iOS.BrazeUICompat pour faciliter votre migration vers .NET MAUI.
La deuxième méthode d’intégration consiste à inclure la source de liaison. Sous appboy-component/src/iosnet6 vous trouverez le code source de notre binding ; en ajoutant une référence de projet à BrazeiOSBinding.csproj dans votre application .NET MAUI, le binding sera créé avec votre projet et vous aurez accès au Braze iOS SDK. Assurez-vous que BrazeiOSBinding.csproj apparaît dans le dossier « Référence » de votre projet.
Étape 2 : Configurez votre instance Braze
Étape 2.1 : Configurez le SDK de Braze dans Braze.xml
Maintenant que les bibliothèques ont été intégrées, vous devez créer un fichier Braze.xml dans le dossier Resources/values de votre projet. Le contenu de ce fichier devrait ressembler à l’extrait de code suivant :
Veillez à remplacer YOUR_API_KEY par la clé API qui se trouve dans Paramètres > Clés API dans le tableau de bord de Braze.
Si vous utilisez l’ancienne navigation, vous pouvez trouver les clés API dans la Console de développement > Paramètres API.
1
2
3
4
5
6
7
8
9
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string translatable="false" name="com_braze_api_key">YOUR_API_KEY</string>
<string translatable="false" name="com_braze_custom_endpoint">YOUR_CUSTOM_ENDPOINT_OR_CLUSTER</string>
<string-array name="com_braze_internal_sdk_metadata">
<item>XAMARIN</item>
<item>NUGET</item>
</string-array>
</resources>
Si vous incluez manuellement la source de la liaison, retirez <item>NUGET</item> de votre code.
Pour voir un exemple de Braze.xml, consultez notre exemple d’application Android MAUI.
Étape 2.2 : Ajouter les autorisations requises au manifeste Android
Maintenant que vous avez ajouté votre clé API, vous devez ajouter les autorisations suivantes à votre fichier AndroidManifest.xml :
1
<uses-permission android:name="android.permission.INTERNET" />
Pour obtenir un exemple de votre AndroidManifest.xml, voir l’exemple d’application Android MAUI.
Étape 2.3 : Suivre les sessions des utilisateurs et l’enregistrement des messages in-app.
Pour activer le suivi de session utilisateur et enregistrer votre application pour les messages in-app, ajoutez l’appel suivant à la méthode de cycle de vie OnCreate() de la classe Application dans votre application :
1
RegisterActivityLifecycleCallbacks(new BrazeActivityLifecycleCallbackListener());
Lors de la configuration de votre instance Braze, ajoutez l’extrait de code suivant pour configurer votre instance :
Veillez à remplacer YOUR_API_KEY par la clé API qui se trouve dans Paramètres > Clés API dans le tableau de bord de Braze.
Si vous utilisez l’ancienne navigation, vous pouvez trouver les clés API dans la Console de développement > Paramètres API.
1
2
3
var configuration = new BRZConfiguration("YOUR_API_KEY", "YOUR_ENDPOINT");
configuration.Api.AddSDKMetadata(new[] { BRZSDKMetadata.Xamarin });
braze = new Braze(configuration);
Voir le fichier App.xaml.cs dans l’exemple d’application iOS MAUI.
Étape 3 : Tester l’intégration
Vous pouvez désormais lancer votre application et voir les sessions enregistrées dans le tableau de bord de Braze (ainsi que les informations relatives à l’appareil et d’autres analyses/analytiques). Pour obtenir une explication approfondie des bonnes pratiques pour l’intégration SDK de base, consultez les instructions d’intégration Android.
Vous pouvez maintenant lancer votre application et voir les sessions enregistrées dans le tableau de bord de Braze. Pour obtenir une explication approfondie des bonnes pratiques pour l’intégration SDK de base, consultez les instructions d’intégration iOS.
Notre liaison MAUI .NET publique actuelle pour le SDK iOS ne se connecte pas au SDK Facebook iOS (liaison des données sociales) et n’inclut pas l’envoi de l’IDFA à Braze.
Intégration de l’application ChatGPT
Configuration
Étape 1 : Obtenez le fichier d’intégration de Braze
Copiez le fichier braze.js de notre référentiel d’intégration des applications ChatGPT dans votre projet. Ce fichier contient toutes les fonctions de configuration et d’aide nécessaires au SDK de Braze.
Étape 2 : Installer les dépendances
Installez notre SDK Web pour bénéficier des fonctionnalités les plus récentes de Braze :
Pour l’intégration côte à côte :
1
npm install @braze/web-sdk
Mise en œuvre
Il existe deux façons d’intégrer Braze à votre application ChatGPT, en fonction de votre cas d’utilisation :
Intégration côte à côte (widgets personnalisés)
Approche recommandée : Cette méthode permet des expériences de messages riches et un suivi en temps réel des interactions des utilisateurs au sein de vos widgets de l’application ChatGPT.
Pour afficher les messages Braze et suivre les interactions des utilisateurs dans vos widgets personnalisés de l’application ChatGPT, utilisez l’intégration SDK Web. Vous trouverez un exemple complet d’envoi de messages dans notre dépôt d’échantillons ici.
Configurer les métadonnées des widgets
Ajoutez les métadonnées suivantes au fichier de votre serveur MCP pour autoriser les domaines Braze, en veillant à mettre à jour le domaine du réseau de diffusion contenu en fonction de votre région:
1
2
3
4
5
6
7
8
9
"openai/widgetCSP": {
connect_domains: ["https://YOUR-SDK-ENDPOINT"],
resource_domains: [
"https://appboy-images.com",
"https://braze-images.com",
"https://cdn.braze.eu",
"https://use.fontawesome.com"
],
}
Remplacez YOUR-SDK-ENDPOINT par votre endpoint SDK Braze.
Mise en place du crochet useBraze
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
import { useBraze } from "./utils/braze";
function YourWidget() {
const braze = useBraze({
apiKey: "your-braze-api-key",
baseUrl: "your-braze-endpoint.braze.com",
});
useEffect(() => {
if (!braze.isInitialized) {
return;
}
// Set user identity
braze.changeUser("user-id-123");
// Log widget interactions
braze.logCustomEvent("viewed_pizzaz_list");
}, [braze.isInitialized]);
return (
// Your widget JSX
);
}
Afficher les cartes de contenu Braze
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
const [cards, setCards] = useState([]);
useEffect(() => {
// Get cached content cards
setCards(braze.getCachedContentCards()?.cards ?? []);
// Subscribe to content card updates
braze.subscribeToContentCardsUpdates((contentCards) => {
setCards(contentCards.cards);
});
// Open session
braze.openSession();
return () => {
braze.removeAllSubscriptions();
}
}, []);
Suivre les événements du widget
1
2
3
4
5
6
7
8
9
10
11
12
13
14
// Track user interactions within your widget
const handleButtonClick = () => {
braze.logCustomEvent("widget_button_clicked", {
button_type: "save_list",
widget_name: "pizza_list"
});
};
const handleItemInteraction = (itemId) => {
braze.logCustomEvent("item_interacted", {
item_id: itemId,
interaction_type: "view_details"
});
};
Intégration côte à côte avec le serveur (serveur MCP)
Si vous avez également besoin d’une intégration côte à côte pour la fonctionnalité d’envoi de messages sur votre serveur MCP, veuillez contacter [email protected]. Pour le suivi des événements et des achats à partir de votre serveur MCP, utilisez notre API REST.
À propos du SDK Braze Vega
Le SDK Braze Vega vous permet de collecter des analyses et d’afficher de riches messages in-app à vos utilisateurs. La plupart des méthodes du SDK Braze Vega sont asynchrones et renvoient des promesses qui doivent être attendues ou résolues.
Intégration du SDK Braze Vega
Étape 1 : Installer la bibliothèque Braze
Installez le SDK Braze Vega à l’aide de votre gestionnaire de paquets préféré.
Si votre projet utilise NPM, vous pouvez ajouter le SDK Braze Vega en tant que dépendance.
1
npm install @braze/vega-sdk --save
Après l’installation, vous pouvez importer les méthodes dont vous avez besoin :
1
import { initialize, changeUser, openSession } from "@braze/vega-sdk";
Si votre projet utilise Yarn, vous pouvez ajouter le SDK Braze Vega comme dépendance.
1
yarn add @braze/vega-sdk
Après l’installation, vous pouvez importer les méthodes dont vous avez besoin :
1
import { initialize, changeUser, openSession } from "@braze/vega-sdk";
Étape 2 : Initialiser le SDK
Une fois le SDK Braze Vega ajouté à votre projet, initialisez la bibliothèque à l’aide de la clé API et de l’URL de l’endpoint du SDK que vous trouverez dans Settings > App Settings dans votre tableau de bord Braze.
Vous devez attendre ou résoudre la promesse changeUser avant d’appeler d’autres méthodes Braze, sinon les événements et les attributs risquent d’être définis sur le mauvais utilisateur.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
import { useEffect } from "react-native";
import {
initialize,
changeUser,
logCustomEvent,
openSession,
setCustomUserAttribute,
setUserCountry
} from "@braze/vega-sdk";
const App = () => {
useEffect(() => {
const initBraze = async () => {
// Initialize the SDK
await initialize("YOUR-API-KEY", "YOUR-SDK-ENDPOINT", {
sessionTimeoutInSeconds: 60,
appVersionNumber: "1.2.3.4",
enableLogging: true, // set to `true` for debugging
});
// Change user
await changeUser("user-id-123");
// Start a session
await openSession();
// Log custom events and set user attributes
logCustomEvent("visited-page", { pageName: "home" });
setCustomUserAttribute("my-attribute", "my-attribute-value");
setUserCountry("USA");
};
initBraze();
}, []);
return (
// Your app components
);
};
Les utilisateurs anonymes peuvent être pris en compte dans votre MAU. Par conséquent, vous pouvez charger ou initialiser conditionnellement le SDK pour exclure ces utilisateurs de votre décompte de MAU.
Configurations optionnelles
Journalisation
Vous pouvez activer la journalisation SDK pour faciliter le débogage et la résolution des problèmes. Il existe plusieurs façons d’activer la journalisation.
Activer la journalisation pendant l’initialisation
Passez enableLogging: true à initialize() pour enregistrer les messages de débogage dans la console :
1
2
3
initialize("YOUR-API-KEY", "YOUR-SDK-ENDPOINT", {
enableLogging: true
});
Les journaux de base sont visibles par tous les utilisateurs, il faut donc envisager de désactiver la journalisation avant de mettre votre code en production.
Activer la journalisation après l’initialisation
Utilisez toggleLogging() pour activer ou désactiver la journalisation du SDK après l’initialisation :
1
2
3
4
import { toggleLogging } from "@braze/vega-sdk";
// Enable logging
toggleLogging();
Journalisation personnalisée
Utilisez setLogger() pour fournir une fonction d’enregistrement personnalisée afin de mieux contrôler la manière dont les enregistrements du SDK sont traités :
1
2
3
4
5
6
import { setLogger } from "@braze/vega-sdk";
setLogger((message) => {
console.log("Braze Custom Logger: " + message);
// Add your custom logging logic here
});
Options de configuration
Vous pouvez transmettre des options de configuration supplémentaires à initialize() pour personnaliser le comportement du SDK :
1
2
3
4
5
await initialize("YOUR-API-KEY", "YOUR-SDK-ENDPOINT", {
sessionTimeoutInSeconds: 60, // Configure session timeout (default is 30 seconds)
appVersionNumber: "1.2.3.4", // Set your app version
enableLogging: true, // Enable SDK logging
});
Mise à niveau du SDK
Lorsque vous référencez le SDK Braze Vega depuis NPM ou Yarn, vous pouvez passer à la dernière version en mettant à jour la dépendance de votre paquet :
1
2
3
npm update @braze/vega-sdk
# or, using yarn:
yarn upgrade @braze/vega-sdk
Tester votre intégration
Pour vérifier que l’intégration SDK fonctionne correctement :
- Initialisez le SDK avec
enableLogging: truepour voir les messages de débogage dans la console. - Veillez à
await changeUser()avant d’appeler d’autres méthodes du SDK - Appelez
await openSession()pour commencer une session - Vérifiez dans votre tableau de bord de Braze, sous Aperçu, que les données de la session sont bien enregistrées.
- Testez l’enregistrement d’un événement personnalisé et vérifiez qu’il apparaît dans votre tableau de bord.
Lors de l’assurance qualité de votre intégration SDK, utilisez le débogueur SDK pour résoudre les problèmes sans avoir à activer l’enregistrement des données pour votre application.
Modifier cette page sur GitHub