---
title: "Implementar paywalls web"
description: "Aprende cómo implementar paywalls web en tu app de React Native con el SDK de Adapty."
---

:::important
Antes de empezar, asegúrate de haber [configurado tu paywall web en el dashboard](web-paywall) e instalado la versión 3.6.1 o posterior del SDK de Adapty.
:::

## Paywalls web abiertos \{#open-web-paywalls\}

Si estás trabajando con un paywall que has desarrollado tú mismo, necesitas gestionar los paywalls web mediante el método del SDK. El método `.openWebPaywall`:
1. Genera una URL única que permite a Adapty vincular un paywall concreto mostrado a un usuario específico con la página web a la que es redirigido.
2. Detecta cuando tus usuarios regresan a la app y, a continuación, llama a `.getProfile` a intervalos cortos para determinar si los derechos de acceso del perfil se han actualizado.
De este modo, si el pago se ha realizado correctamente y se han actualizado los derechos de acceso, la suscripción se activa en la app casi de inmediato.

```typescript showLineNumbers title="React Native (TSX)"

try {
    await adapty.openWebPaywall(product);
} catch (error) {
    console.warn('Failed to open web paywall:', error);
}
```
:::note
Hay dos versiones del método `openWebPaywall`:
1. `openWebPaywall(product)` que genera URLs por paywall y también añade los datos del producto a las URLs.
2. `openWebPaywall(paywall)` que genera URLs por paywall sin añadir los datos del producto a las URLs. Úsala cuando tus productos en el paywall de Adapty sean diferentes a los del web paywall.
:::

#### Gestionar errores \{#handle-errors\}
| Error                                   | Descripción                                                          | Acción recomendada                                                                     |
|-----------------------------------------|----------------------------------------------------------------------|----------------------------------------------------------------------------------------|
| AdaptyError.paywallWithoutPurchaseUrl   | El paywall no tiene configurada una URL de compra web                | Comprueba si el paywall está correctamente configurado en el Adapty Dashboard          |
| AdaptyError.productWithoutPurchaseUrl   | El producto no tiene una URL de compra web                           | Verifica la configuración del producto en el Adapty Dashboard                          |
| AdaptyError.failedOpeningWebPaywallUrl  | No se pudo abrir la URL en el navegador                              | Revisa la configuración del dispositivo o proporciona un método de compra alternativo  |
| AdaptyError.failedDecodingWebPaywallUrl | No se pudieron codificar correctamente los parámetros en la URL      | Verifica que los parámetros de la URL sean válidos y estén correctamente formateados   |
## Abrir paywalls web en un navegador integrado \{#open-web-paywalls-in-an-in-app-browser\}

:::important
La apertura de paywalls web en un navegador integrado está disponible a partir de la versión 3.15 del SDK de Adapty.
:::

Por defecto, los paywalls web se abren en el navegador externo.

Para ofrecer una experiencia de usuario fluida, puedes abrirlos en un navegador integrado. Esto muestra la página de compra web dentro de tu aplicación, permitiendo a los usuarios completar las transacciones sin cambiar de app.

Para activarlo, pasa `WebPresentation.BrowserInApp` como segundo argumento de `openWebPaywall`:
```typescript showLineNumbers title="React Native (TSX)"

try {
    await adapty.openWebPaywall(
        product,
        WebPresentation.BrowserInApp, // default – WebPresentation.BrowserOutApp
    );
} catch (error) {
    console.warn('Failed to open web paywall:', error);
}

```