---
title: "Implementar paywalls web"
description: "Aprende a implementar paywalls web en tu app de Capacitor con el SDK de Adapty."
---

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

## Abrir paywalls web \{#open-web-paywalls\}

Si estás trabajando con un paywall que desarrollaste tú mismo, necesitas gestionar los paywalls web usando 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 vuelven a la app y luego solicita `.getProfile` a intervalos cortos para determinar si los derechos de acceso del perfil se han actualizado.

De esta forma, si el pago fue exitoso y los derechos de acceso se han actualizado, la suscripción se activa en la app casi de inmediato.

```typescript showLineNumbers

try {
  await adapty.openWebPaywall({ paywallOrProduct: product });
} catch (error) {
  console.error('Failed to open web paywall:', error);
}
```

:::note
Existen dos versiones del método `openWebPaywall`:
1. `openWebPaywall({ paywallOrProduct: product })` que genera URLs por paywall y también añade los datos del producto a las URLs.
2. `openWebPaywall({ paywallOrProduct: paywall })` que genera URLs por paywall sin añadir los datos del producto a las URLs. Úsalo cuando tus productos en el paywall de Adapty difieran de los del paywall web.
:::

#### 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                        | Comprueba 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 in-app \{#open-web-paywalls-in-an-in-app-browser\}

:::important
La apertura de paywalls web en un navegador in-app está disponible a partir del SDK de Adapty v. 3.15.
:::

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

Para ofrecer una experiencia de usuario fluida, puedes abrir los paywalls web en un navegador in-app. 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 habilitarlo, establece `openIn` como `WebPresentation.BrowserInApp` en `openWebPaywall`:

```typescript showLineNumbers

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