Récupérer les onboardings dans le SDK React Native

Warning

Les onboardings sont dépréciés à partir du SDK Adapty v4. Créez des flows à la place : contrairement aux onboardings, qui s’exécutent dans une WebView, les flows s’affichent nativement sur l’appareil — animations plus fluides, aspect natif cohérent, temps de chargement réduits et aucune dépendance à l’environnement WebView.

Après avoir conçu la partie visuelle de votre onboarding avec le builder dans l’Adapty Dashboard, vous pouvez l’afficher dans votre application React Native. La première étape consiste à récupérer l’onboarding associé au placement et sa configuration d’affichage, comme décrit ci-dessous.

Avant de commencer, assurez-vous que :

  1. Vous avez installé le SDK Adapty React Native en version 3.8.0 ou supérieure.
  2. Vous avez créé un onboarding.
  3. Vous avez ajouté l’onboarding à un placement.

Récupérer l’onboarding

Lorsque vous créez un onboarding avec notre éditeur no-code, il est stocké sous forme de conteneur de configuration que votre application doit récupérer et afficher. Ce conteneur gère l’ensemble de l’expérience : le contenu affiché, sa présentation et le traitement des interactions utilisateur (réponses à un quiz, saisies dans un formulaire, etc.). Il suit également automatiquement les événements analytiques, ce qui vous évite d’implémenter un suivi des vues séparé.

Pour de meilleures performances, récupérez la configuration de l’onboarding tôt afin que les images aient le temps de se télécharger avant d’être affichées aux utilisateurs.

Pour obtenir un onboarding, utilisez la méthode getOnboarding :

try {
    const placementId = 'YOUR_PLACEMENT_ID';
    const locale = 'en';

    const onboarding = await adapty.getOnboarding(placementId, locale);
    // the requested onboarding
} catch (error) {
    // handle the error
}

Ensuite, appelez la méthode createOnboardingView pour créer une instance de vue.

Warning

Le résultat de la méthode createOnboardingView ne peut être utilisé qu’une seule fois. Si vous avez besoin de l’utiliser à nouveau, appelez la méthode createOnboardingView de nouveau. L’appeler deux fois sans recréer peut entraîner l’erreur AdaptyUIError.viewAlreadyPresented.

// for the Adapty SDK < 3.14 – import {createOnboardingView} from 'react-native-adapty/dist/ui';

if (onboarding.hasViewConfiguration) {
    try {
        const view = await createOnboardingView(onboarding);
    } catch (error) {
        // handle the error
    }
} else {
    //use your custom logic
}

Paramètres :

ParamètrePrésenceDescription
placementIdrequisL’identifiant du Placement souhaité. Il s’agit de la valeur que vous avez indiquée lors de la création d’un placement dans l’Adapty Dashboard.
locale

optionnel

par défaut : en

L’identifiant de la localisation de l’onboarding. Ce paramètre doit être un code de langue composé d’un ou deux sous-tags séparés par le caractère moins (-). Le premier sous-tag désigne la langue, le second la région.

Exemple : en signifie anglais, pt-br représente le portugais brésilien.

Consultez Localisations et codes de langue pour plus d’informations sur les codes de langue et la manière dont nous recommandons de les utiliser.

fetchPolicypar défaut : .reloadRevalidatingCacheData

Par défaut, le SDK tente de charger les données depuis le serveur et renvoie les données en cache en cas d’échec. Nous recommandons cette option, car elle garantit que vos utilisateurs disposent toujours des données les plus récentes.

Toutefois, si vous pensez que vos utilisateurs ont une connexion internet instable, envisagez d’utiliser .returnCacheDataElseLoad pour renvoyer les données en cache lorsqu’elles existent. Dans ce cas, les utilisateurs ne bénéficieront peut-être pas des toutes dernières données, mais les temps de chargement seront plus rapides, quelle que soit la qualité de leur connexion. Le cache est mis à jour régulièrement, il est donc possible de l’utiliser pendant la session pour éviter les requêtes réseau.

Notez que le cache est conservé après un redémarrage de l’application et n’est effacé que lors d’une réinstallation ou d’un nettoyage manuel.

Le SDK Adapty stocke les onboardings localement sur deux couches : le cache mis à jour régulièrement décrit ci-dessus et les onboardings de secours. Nous utilisons également un CDN pour récupérer les onboardings plus rapidement, ainsi qu’un serveur de secours indépendant en cas d’indisponibilité du CDN. Ce système est conçu pour garantir que vous disposez toujours de la dernière version de vos onboardings, tout en assurant la fiabilité même lorsque la connexion internet est limitée.

loadTimeoutMspar défaut : 5 s

Cette valeur limite le délai d’expiration de cette méthode. Si le délai est atteint, les données en cache ou le fallback local sont renvoyés.

Notez que dans de rares cas, cette méthode peut expirer légèrement après le délai spécifié dans loadTimeout, car l’opération peut impliquer plusieurs requêtes en coulisses.

Paramètres de la réponse :

ParamètreDescription
OnboardingUn objet AdaptyOnboarding contenant : l’identifiant et la configuration de l’onboarding, le Remote Config, ainsi que plusieurs autres propriétés.

Accélérer la récupération d’un onboarding avec l’onboarding d’audience par défaut

En règle générale, les onboardings sont récupérés quasi instantanément, vous n’avez donc pas à vous soucier d’optimiser ce processus. Cependant, si vous avez de nombreuses audiences et onboardings et que vos utilisateurs disposent d’une connexion internet faible, la récupération d’un onboarding peut prendre plus de temps que souhaité. Dans ce cas, vous pouvez afficher un onboarding par défaut pour garantir une expérience fluide plutôt que de ne rien afficher du tout.

Pour y remédier, vous pouvez utiliser la méthode getOnboardingForDefaultAudience, qui récupère l’onboarding du placement spécifié pour l’audience All Users. Cependant, il est essentiel de comprendre que l’approche recommandée est de récupérer l’onboarding avec la méthode getOnboarding, comme décrit dans la section Récupérer l’onboarding ci-dessus.

Warning

Préférez getOnboarding à getOnboardingForDefaultAudience, car cette dernière présente des limitations importantes :

  • Problèmes de compatibilité : peut créer des difficultés lors de la prise en charge de plusieurs versions d’application, nécessitant soit des designs rétrocompatibles, soit d’accepter que les anciennes versions s’affichent incorrectement.
  • Aucune personnalisation : affiche uniquement le contenu pour l’audience « Tous les utilisateurs », sans ciblage basé sur le pays, l’attribution ou les attributs personnalisés.

Si une récupération plus rapide compense ces inconvénients pour votre cas d’usage, utilisez getOnboardingForDefaultAudience comme indiqué ci-dessous. Sinon, utilisez getOnboarding comme décrit ci-dessus.

try {
    const placementId = 'YOUR_PLACEMENT_ID';
    const locale = 'en';

    const onboarding = await adapty.getOnboardingForDefaultAudience(placementId, locale);
    // the requested onboarding
} catch (error) {
    // handle the error
}

Paramètres :

ParamètrePrésenceDescription
placementIdrequisL’identifiant du Placement souhaité. Il s’agit de la valeur que vous avez indiquée lors de la création d’un placement dans l’Adapty Dashboard.
locale

optionnel

par défaut : en

L’identifiant de la localisation de l’onboarding. Ce paramètre doit être un code de langue composé d’un ou deux sous-tags séparés par le caractère moins (-). Le premier sous-tag correspond à la langue, le second à la région.

Exemple : en désigne l’anglais, pt-br représente le portugais brésilien.

Consultez Localisations et codes de langue pour plus d’informations sur les codes de langue et la façon dont nous recommandons de les utiliser.

fetchPolicypar défaut : .reloadRevalidatingCacheData

Par défaut, le SDK tente de charger les données depuis le serveur et renvoie les données en cache en cas d’échec. Nous recommandons cette option car elle garantit que vos utilisateurs reçoivent toujours les données les plus récentes.

Cependant, si vous pensez que vos utilisateurs ont une connexion internet instable, envisagez d’utiliser .returnCacheDataElseLoad pour renvoyer les données en cache si elles existent. Dans ce cas, les utilisateurs ne disposeront peut-être pas des toutes dernières données, mais les temps de chargement seront plus rapides, quelle que soit la qualité de leur connexion. Le cache est mis à jour régulièrement, il est donc sûr de l’utiliser pendant la session afin d’éviter les requêtes réseau.

Notez que le cache reste intact après le redémarrage de l’application et n’est effacé que lors de la désinstallation de celle-ci ou via une suppression manuelle.

Le SDK Adapty stocke les onboardings localement sur deux niveaux : le cache régulièrement mis à jour décrit ci-dessus et les onboardings de secours. Nous utilisons également un CDN pour récupérer les onboardings plus rapidement, ainsi qu’un serveur de secours indépendant en cas d’indisponibilité du CDN. Ce système est conçu pour vous garantir la dernière version de vos onboardings tout en assurant la fiabilité même lorsque la connexion internet est limitée.