SDK React Native

@traqio/react-native est le SDK Traqio pour React Native. Il fournit un module natif en autolinking (Kotlin et Swift) et réexporte le moteur JavaScript, @traqio/core, pour que votre app importe tout depuis un seul paquet. C’est le SDK vérifié de bout en bout sur un appareil : un clic, une installation depuis Google Play, le referrer lu au premier lancement, une installation attribuée de façon déterministe. Pour une app Expo, suivez plutôt la page Expo.

Prérequis#

• React Native 0.74 ou ultérieur.
• Expo Modules dans le projet (npx install-expo-modules@latest) — la moitié native est un module Expo.
• iOS 15.1 ou ultérieur. Android ne demande aucune permission (sauf si vous activez l’identifiant publicitaire).

Mise en place#

1. Activez Expo Modules#

   npx install-expo-modules@latest

   Une fois par projet. Passez cette étape si votre app utilise déjà un module Expo.

2. Installez le paquet#

   npm install @traqio/react-native @react-native-async-storage/async-storage
   cd ios && pod install

   AsyncStorage est ce qui fait que l’installation n’est signalée qu’une seule fois et que les événements en file d’attente survivent aux redémarrages ; le SDK le détecte tout seul quand il est installé. Sans lui, le SDK émet un avertissement et signale l’installation à nouveau à chaque lancement.

3. Initialisez avant d’enregistrer l’app#

   index.js

   // index.js — before AppRegistry.registerComponent
   import { Traqio, getNativeBridge } from "@traqio/react-native";
   import { version } from "./package.json";
   
   Traqio.init({
     sdkKey: "YOUR_SDK_KEY",
     endpoint: "https://api.traqio.app",
     native: getNativeBridge(),
     appVersion: version,
   });

   Initialiser avant AppRegistry.registerComponent garantit que le SDK écoute déjà quand l’URL qui a ouvert l’app est livrée. L’appel est idempotent.

4. Déclarez l’endpoint SKAdNetwork#

   ios/YourApp/Info.plist

   <key>NSAdvertisingAttributionReportEndpoint</key>
   <string>https://api.traqio.app</string>

   iOS envoie alors à Traqio une copie de chaque postback SKAdNetwork de votre app. L’origine seule : iOS ajoute son propre chemin.

5. Suivez les événements et définissez l’identifiant utilisateur#

   Traqio.setUserId(user.id); // after sign-in — same id as RevenueCat's app_user_id
   
   Traqio.track("purchase", { value: 9.99, currency: "EUR", transactionId: purchase.transactionId });

   Voir Événements et revenus pour les noms sur lesquels Meta et TikTok peuvent s’optimiser, et pourquoi transactionId compte.

Deep links#

Le SDK écoute lui-même le Linking de React Native — l’URL initiale et toutes les suivantes — et transmet les liens Traqio à votre callback :

Traqio.onDeepLink(({ deepLink }) => {
  if (deepLink) navigation.navigate(...routeFor(deepLink)); // your router's call
});

Les liens n’ouvrent l’app que si l’app déclare votre domaine personnalisé :

<!-- android/app/src/main/AndroidManifest.xml, inside the main <activity> -->
<intent-filter android:autoVerify="true">
  <action android:name="android.intent.action.VIEW" />
  <category android:name="android.intent.category.DEFAULT" />
  <category android:name="android.intent.category.BROWSABLE" />
  <data android:scheme="https" android:host="go.example.com" android:pathPrefix="/c/" />
</intent-filter>

Sur iOS, ajoutez applinks:go.example.com sous Signing & Capabilities → Associated Domains, et laissez React Native recevoir les universal links comme d’habitude :

// AppDelegate — hand universal links to React Native's Linking, as usual
- (BOOL)application:(UIApplication *)application
    continueUserActivity:(NSUserActivity *)userActivity
      restorationHandler:(void (^)(NSArray<id<UIUserActivityRestoring>> *))restorationHandler {
  return [RCTLinkingManager application:application
                   continueUserActivity:userActivity
                     restorationHandler:restorationHandler];
}

Le domaine lui-même se configure dans la console ; voir Deep linking.

Notes par plateforme#

Android#

• Le module déclare l’entrée <queries> qui lui permet de voir Google Play sur Android 11+ ; aucune modification du manifest n’est nécessaire pour l’attribution.
• Si Google Play ne répond pas au premier lancement, l’installation est mise en attente et retentée aux lancements suivants (jusqu’à trois) plutôt que signalée comme organique.

iOS#

• Aucune invite App Tracking Transparency n’est nécessaire ni affichée par le SDK.
• Les valeurs de conversion suivent le mapping que vous publiez dans la console. Si votre app gère déjà son propre schéma de valeurs de conversion, désactivez celui du SDK avec skan: false — deux écrivains se disputeraient les six mêmes bits.

Identifiant publicitaire (à activer)#

Désactivé par défaut : le SDK n’envoie ni IDFA ni GAID. Activez collectAdvertisingId seulement si vous achetez sur des régies qui attribuent par l’identifiant publicitaire — Unity Ads et AppLovin rattachent leur clic à votre installation grâce à lui. Il est envoyé avec l’installation et ne lui sert jamais d’identité.

Traqio.init({
  sdkKey: "YOUR_SDK_KEY",
  endpoint: "https://api.traqio.app",
  native: getNativeBridge(),
  collectAdvertisingId: true, // off by default
});

• iOS : le SDK n’affiche jamais l’invite App Tracking Transparency — demandez-la vous-même avantinit, et liez AdSupport. L’IDFA n’est lu que si l’utilisateur a déjà autorisé le suivi.
• Android : ajoutez com.google.android.gms:play-services-ads-identifier et la permissioncom.google.android.gms.permission.AD_ID à votre app ; le SDK ne déclare ni l’une ni l’autre.
• Déclarez l’identifiant publicitaire dans vos informations de confidentialité App Store et le formulaire Sécurité des données de Google Play.

Questions fréquentes#

Pourquoi une app React Native bare a-t-elle besoin d’Expo Modules ?

La moitié native du SDK (le lecteur de l’Install Referrer sur Android, le pilote SKAdNetwork sur iOS) est écrite sous forme de module Expo : elle a donc besoin du petit runtime Expo Modules qu’install-expo-modules ajoute à un projet bare. Cela ne transforme pas l’app en app Expo managed et n’ajoute aucun service Expo.

Dois-je envoyer les événements (flush) ou signaler les ouvertures de l’app moi-même ?

Non. Sur React Native, le SDK écoute AppState : il envoie la file quand l’app passe en arrière-plan et enregistre une ouverture de l’app quand elle revient après 30 minutes ou plus. Les hôtes sans l’AppState de React Native, comme Capacitor, appellent flush() et appOpened() eux-mêmes.