Obtener onboardings en el SDK de React Native

Los onboardings están obsoletos en SDK v4 y se eliminarán en una versión futura. Ya no reciben correcciones ni mejoras. Usa flows en su lugar: a diferencia de los onboardings, que se ejecutan dentro de un WebView, los flows se renderizan de forma nativa en el dispositivo, lo que ofrece animaciones más fluidas, una apariencia nativa consistente, tiempos de carga más rápidos y sin dependencia del runtime de WebView. Consulta Obtener flows y paywalls y Mostrar flows y paywalls para empezar.

Después de diseñar la parte visual de tu onboarding con el editor en el Adapty Dashboard, puedes mostrarlo en tu app de React Native. El primer paso es obtener el onboarding asociado al placement y su configuración de vista, tal como se describe a continuación.

Antes de empezar, asegúrate de que:

  1. Tienes instalado el SDK de Adapty para React Native versión 3.8.0 o superior.
  2. Has creado un onboarding.
  3. Has añadido el onboarding a un placement.

Obtener el onboarding

Cuando creas un onboarding con nuestro editor sin código, se almacena como un contenedor con la configuración que tu aplicación necesita obtener y mostrar. Este contenedor gestiona toda la experiencia: qué contenido aparece, cómo se presenta y cómo se procesan las interacciones del usuario (como respuestas a cuestionarios o entradas de formularios). El contenedor también registra automáticamente los eventos de análisis, por lo que no necesitas implementar un seguimiento de vistas por separado.

Para un mejor rendimiento, obtén la configuración del onboarding con antelación para que las imágenes tengan tiempo suficiente de descargarse antes de mostrárselas a los usuarios. Para obtener un onboarding, usa el método 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
}

Luego, llama al método createOnboardingView para crear una instancia de la vista.

El resultado del método createOnboardingView solo puede usarse una vez. Si necesitas usarlo de nuevo, llama al método createOnboardingView otra vez. Llamarlo dos veces sin recrearlo puede provocar el error 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
}

Parámetros:

ParámetroPresenciaDescripción
placementIdobligatorioEl identificador del Placement deseado. Es el valor que especificaste al crear un placement en el Adapty Dashboard.
locale

opcional

por defecto: en

El identificador de la localización del onboarding. Se espera que este parámetro sea un código de idioma compuesto de una o dos subetiquetas separadas por el carácter menos (-). La primera subetiqueta corresponde al idioma y la segunda, a la región.

Ejemplo: en significa inglés, pt-br representa el portugués brasileño.

Consulta Localizaciones y códigos de idioma para más información sobre los códigos de idioma y cómo recomendamos usarlos.

fetchPolicypor defecto: .reloadRevalidatingCacheData

Por defecto, el SDK intentará cargar los datos desde el servidor y devolverá los datos en caché en caso de error. Recomendamos esta opción porque garantiza que tus usuarios siempre obtengan los datos más actualizados.

Sin embargo, si crees que tus usuarios tienen una conexión a internet inestable, considera usar .returnCacheDataElseLoad para devolver los datos en caché si existen. En este caso, es posible que los usuarios no obtengan los datos absolutamente más recientes, pero experimentarán tiempos de carga más rápidos, independientemente de lo irregular que sea su conexión. La caché se actualiza con regularidad, por lo que es seguro usarla durante la sesión para evitar solicitudes de red.

Ten en cuenta que la caché se mantiene intacta al reiniciar la app y solo se borra cuando se desinstala la app o mediante una limpieza manual.

El SDK de Adapty almacena los onboardings localmente en dos capas: la caché de actualización periódica descrita anteriormente y los onboardings de respaldo. También usamos CDN para cargar los onboardings más rápido y un servidor de respaldo independiente en caso de que el CDN no esté disponible. Este sistema está diseñado para garantizar que siempre obtengas la versión más reciente de tus onboardings, asegurando la fiabilidad incluso cuando la conexión a internet es escasa.

loadTimeoutMspor defecto: 5 seg

Este valor limita el tiempo de espera de este método. Si se alcanza el tiempo límite, se devolverán los datos en caché o el fallback local.

Ten en cuenta que en casos excepcionales este método puede agotarse ligeramente después del tiempo especificado en loadTimeout, ya que la operación puede estar compuesta de diferentes solicitudes internamente.

Parámetros de respuesta:
ParámetroDescripción
OnboardingUn objeto AdaptyOnboarding con: el identificador y la configuración del onboarding, Remote Config y varias otras propiedades.

Acelera la obtención del onboarding con el onboarding de audiencia predeterminada

Por lo general, los onboardings se obtienen casi de forma instantánea, así que no tienes que preocuparte por acelerar este proceso. Sin embargo, cuando tienes muchas audiencias y onboardings, y tus usuarios tienen una conexión a internet débil, obtener un onboarding puede tardar más de lo deseado. En esos casos, puede que quieras mostrar un onboarding predeterminado para garantizar una experiencia de usuario fluida en lugar de no mostrar ningún onboarding. Para solucionar esto, puedes usar el método getOnboardingForDefaultAudience, que obtiene el onboarding del placement especificado para la audiencia All Users. Sin embargo, es fundamental entender que el enfoque recomendado es obtener el onboarding con el método getOnboarding, tal como se detalla en la sección Obtener onboarding anterior.

Considera usar getOnboarding en lugar de getOnboardingForDefaultAudience, ya que este último tiene limitaciones importantes:

  • Problemas de compatibilidad: Puede generar problemas al dar soporte a varias versiones de la app, lo que obliga a diseñar con compatibilidad hacia atrás o asumir que las versiones antiguas podrían mostrarse incorrectamente.
  • Sin personalización: Solo muestra contenido para la audiencia “All Users”, eliminando la segmentación por país, atribución o atributos personalizados.

Si la obtención más rápida compensa estos inconvenientes en tu caso de uso, utiliza getOnboardingForDefaultAudience como se muestra a continuación. De lo contrario, usa getOnboarding como se describe arriba.

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

    const onboarding = await adapty.getOnboardingForDefaultAudience(placementId, locale);
    // el onboarding solicitado
} catch (error) {
    // manejar el error
}

Parámetros:

ParámetroPresenciaDescripción
placementIdrequeridoEl identificador del Placement deseado. Es el valor que especificaste al crear un placement en el Adapty Dashboard.
locale

opcional

por defecto: en

El identificador de la localización del onboarding. Se espera que este parámetro sea un código de idioma compuesto por uno o dos subetiquetas separadas por el carácter menos (-). La primera subetiqueta corresponde al idioma y la segunda a la región.

Ejemplo: en significa inglés, pt-br representa el portugués de Brasil.

Consulta Localizaciones y códigos de idioma para más información sobre los códigos de idioma y cómo recomendamos usarlos.

fetchPolicypor defecto: .reloadRevalidatingCacheData

Por defecto, el SDK intentará cargar los datos desde el servidor y devolverá los datos en caché en caso de fallo. Recomendamos esta opción porque garantiza que tus usuarios siempre obtengan los datos más actualizados.

Sin embargo, si crees que tus usuarios tienen una conexión a internet inestable, considera usar .returnCacheDataElseLoad para devolver los datos en caché si existen. En este caso, puede que los usuarios no obtengan los datos absolutamente más recientes, pero experimentarán tiempos de carga más rápidos, independientemente de lo irregular que sea su conexión. La caché se actualiza regularmente, por lo que es seguro usarla durante la sesión para evitar peticiones de red.

Ten en cuenta que la caché permanece intacta al reiniciar la app y solo se borra cuando se reinstala la app o mediante una limpieza manual.

El SDK de Adapty almacena los onboardings localmente en dos capas: la caché de actualización periódica descrita anteriormente y los onboardings de respaldo. También usamos CDN para obtener los onboardings más rápido y un servidor de respaldo independiente en caso de que el CDN no esté disponible. Este sistema está diseñado para garantizar que siempre obtengas la versión más reciente de tus onboardings y al mismo tiempo asegurar la fiabilidad incluso cuando la conexión a internet es escasa.