---
title: "Веб-пейвол"
description: "Настройте веб-пейвол для приёма платежей без комиссий и проверок App Store."
---

:::important
Перед началом убедитесь, что у вас установлена необходимая версия SDK Adapty:
- **Paywall Builder или кастомные пейволы**: 3.6.1 или выше (iOS), 3.15 или выше (Android и кроссплатформенные)
- **Flow Builder**: 4.0 или выше (все платформы)
:::
С помощью Adapty вы можете создать пейвол или [флоу](adapty-paywall-builder) с кнопкой, которая перенаправляет пользователей в браузер для оплаты. После успешной покупки подписка активируется, когда пользователь возвращается в приложение.
Это позволяет избежать комиссии стора и при этом отслеживать платежи.

:::tip
App Store разрешает внешние способы оплаты только в США и Японии.
Чтобы использовать пейвол исключительно для этих рынков, продублируйте текущий пейвол и настройте веб-пейвол. Таким образом, у вас будет два почти одинаковых пейвола: один для США и Японии, другой — для всех остальных.
:::
## Как это работает \{#how-it-works\}

Веб-пейвол — это уникальный URL, который генерируется для каждого из ваших встроенных пейволов. Он открывается в браузере для оплаты и работает с различными платёжными провайдерами (Stripe, Paddle и другими), поддерживая как простую страницу с кнопкой Apple Pay, так и более сложные флоу с дополнительными предложениями.

Веб-пейволы работают следующим образом:
1. **Настройте внешний вид и поведение веб-пейвола** в редакторе веб-пейвола.
2. **Привяжите веб-пейвол** в настройках пейвола.
3. В пейволе приложения **добавьте кнопку**, которая перенаправляет пользователей в браузер.
4. Когда пользователь нажимает кнопку, Adapty SDK **генерирует уникальный URL**.
5. Пользователи **переходят на страницу веб-пейвола** и **оплачивают** подписку через внешний способ оплаты.
6. Когда они возвращаются в приложение, Adapty SDK **опрашивает сервер на наличие обновлений профиля**, чтобы подтвердить активацию подписки.
7. Adapty фиксирует покупку и отслеживает статус подписки — продления, отмены и другие изменения.
## Шаг 1. Создайте веб-пейвол \{#step-1-create-a-web-paywall\}
1. Подготовьте пейвол для работы:
   - Чтобы включить внешние платежи для существующего пейвола, [продублируйте](duplicate-paywalls) его. Это позволит показывать веб-пейвол нужному сегменту пользователей, а оригинал — всем остальным.
   - Чтобы начать с нуля, [создайте](create-paywall) новый пейвол.
2. На странице пейвола перейдите на вкладку **Web paywall** и нажмите **Create web paywall**. Вы будете перенаправлены на новую страницу.

3. Настройте веб-пейвол и подключите способ оплаты.
:::tip
Помощь по настройке внешнего редактора и подключению платёжного провайдера можно найти в [быстром старте](web-paywall-configuration).
:::
4. Вернитесь на страницу **Web paywall** и вставьте ссылку на пейвол.
:::important
При запуске пейвола в продакшн убедитесь, что используете правильную ссылку, сгенерированную после публикации веб-пейвола. Формат ссылки: `paywalls-....fnlfx.com`.
:::
5. Нажмите **Save**.

## Шаг 2. Запустите пейвол \{#step-2-trigger-the-paywall\}

Чтобы использовать веб-пейвол, нужно его запустить — способ зависит от вашей конфигурации:

- Если вы используете пейвол, созданный в Builder, достаточно [добавить новую кнопку](#step-2a-add-a-web-purchase-button), которая будет использовать указанную вами ссылку для отслеживания покупок и передачи данных в Adapty.
- Если вы используете SDK, необходимо настроить метод [`openWebPaywall`](#step-2b-set-up-the-sdk-method) для работы с веб-пейволами.

### Шаг 2a. Добавьте кнопку веб-покупки \{#step-2a-add-a-web-purchase-button\}

Если вы используете **Flow Builder**, вам нужно добавить кнопку веб-пейвола. Кнопка будет использовать указанную вами ссылку для отслеживания покупок и передачи данных обратно в Adapty.

1. Откройте флоу и добавьте кнопку.

   Если вы используете шаблон или уже существующий пейвол, добавьте кнопку веб-пейвола рядом с существующей кнопкой покупки. Настроить её можно точно так же.
2. На панели **Interactions** справа нажмите **Add trigger**. Затем назначьте этому триггеру действие **Purchase**.
   
3. В настройках действия перейдите на вкладку **Web payment**. Там выберите продукт и — при необходимости — оффер, который будет связан с кнопкой веб-покупки.

4. Вставьте ссылку на веб-пейвол в поле **Web paywall URL**.

5. По умолчанию веб-пейволы открываются во встроенном браузере, чтобы пользователи не покидали ваше приложение. Если вы хотите открывать их во внешнем браузере, выберите **Open in external browser**.

### Шаг 2б. Вызовите метод SDK \{#step-2b-call-the-sdk-method\}

Если вы работаете с пейволом, разработанным самостоятельно, необходимо обработать веб-пейволы через метод SDK. Ознакомьтесь с гайдами для конкретных платформ:

- [iOS](ios-web-paywall)
- [Android](android-web-paywall)
- [React Native](react-native-web-paywall)
- [Flutter](flutter-web-paywall)
- [Unity](unity-web-paywalls)

## Шаг 3. Настройте плейсмент \{#step-3-set-up-a-placement\}

Поскольку App Store разрешает внешние способы оплаты только в США и Японии, создайте отдельный сегмент пользователей для iOS-пользователей в этих регионах и настройте плейсмент так, чтобы разные пейволы показывались разным сегментам. Для Android-пользователей географических ограничений нет — создайте отдельный Android-сегмент без фильтра по стране.
1. [Создайте новый сегмент](segments) со следующими атрибутами:
   - **Country from store account**: United States, Japan
   - **Platform**: iOS and iPadOS
   - **App version**: последняя версия, использующая Adapty SDK.

2. [Создайте](create-placement) плейсмент или [отредактируйте](edit-placement) существующий. [Добавьте новую аудиторию](add-audience-paywall-ab-test) с веб-пейволом и созданным сегментом.