---
title: "Веб-пейвол"
description: "Настройте веб-пейвол, чтобы принимать платежи без комиссий и проверок App Store."
---

> **AI agents**: to search Adapty docs faster and with fewer tokens, install the Adapty skill. Claude Code (self-updating via plugin): `claude plugin marketplace add adaptyteam/adapty-skills && claude plugin install adapty-skills@adapty` — other tools: `npx skills add adaptyteam/adapty-skills --all`

:::important
Перед началом убедитесь, что у вас установлена нужная версия SDK Adapty:
- **Paywall Builder или кастомные пейволы**: 3.6.1 или выше (iOS), 3.15 или выше (Android и кросс-платформенные)
- **Flow & Paywall Builder**: 4.0 или выше (все платформы)
:::

С помощью Adapty вы можете создать пейвол или [флоу](adapty-flow-builder) с кнопкой, которая перенаправляет пользователей в браузер для оплаты. После успешной покупки пользователь возвращается в приложение, и подписка активируется.
На американском стороре App Store это позволяет избежать комиссии магазина, при этом Adapty продолжает отслеживать платежи пользователей.

:::tip
В App Store веб-пейволы работают без дополнительных требований и комиссии Apple только на витрине US. Для других регионов смотрите раздел [Другие регионы App Store](#other-app-store-regions).

Чтобы использовать пейвол исключительно для США, продублируйте текущий пейвол и настройте веб-пейвол. Так у вас будет два почти одинаковых пейвола: один для США, другой для всех остальных.
:::

## Как это работает \{#how-it-works\}

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

Веб-пейволы работают следующим образом:
1. **Настройте внешний вид** веб-пейвола и его поведение в редакторе.
2. **Привяжите веб-пейвол** в настройках пейвола.
3. В пейволе приложения **добавьте кнопку**, перенаправляющую пользователей в браузер.
4. Когда пользователи нажимают кнопку, Adapty SDK **генерирует уникальный URL**, содержащий Adapty profile ID пользователя.
5. Пользователи **переходят на страницу веб-пейвола** и **оплачивают** подписку через внешний способ оплаты.
6. При возвращении в приложение Adapty SDK **проверяет обновления профиля**, чтобы подтвердить активацию подписки.
7. Adapty фиксирует покупку и отслеживает статус подписки: продления, отмены и другие изменения.

Идентификатор профиля в URL связывает веб-покупку с пользователем приложения. Покупка привязывается к профилю, который уже используется в вашем приложении, поэтому вызывать `Adapty.identify()` для веб-покупателя не нужно.

## Шаг 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. Запуск пейвола

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

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

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

Если вы используете **Flow & Paywall 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
   - **Platform**: iOS and iPadOS
   - **App version**: последняя версия, использующая Adapty SDK.

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

### Другие регионы App Store \{#other-app-store-regions\}

В Европейском союзе, Японии и Бразилии приложениям также разрешено ссылаться на покупки в интернете, при соблюдении следующих условий:

- Ваш аккаунт разработчика должен иметь соответствующий entitlement от Apple для данного региона.
- Перед открытием ссылки приложение должно показать информационный лист Apple (disclosure sheet). SDK Adapty не показывает его.
- Apple взимает комиссию 15% за покупки, совершённые в течение 7 дней после перехода по ссылке. Сниженная ставка для участников программы Small Business Program и для подписок после первого года составляет 10%.
- В Японии и Бразилии приложение также должно предлагать встроенные покупки на том же экране.

Полные правила смотрите на страницах Apple для [Европейского союза](https://developer.apple.com/support/payment-options-on-the-app-store-in-the-eu), [Японии](https://developer.apple.com/support/app-distribution-in-japan/) и [Бразилии](https://developer.apple.com/support/app-distribution-in-brazil/).

## Добавление воронки отмены \{#add-a-cancellation-funnel\}

Воронка отмены — это веб-страница, которую подписчик открывает, чтобы отменить подписку. Прежде чем отмена вступит в силу, воронка может предложить паузу, скидку или бесплатный период. Вы создаёте её в том же редакторе, что и веб-пейвол, а приложение открывает её по URL. Воронка отменяет подписку напрямую через платёжного провайдера, так что приложению не нужно делать никаких API-вызовов для отмены.

Чтобы создать воронку отмены, откройте вкладку **Cancellation** в редакторе веб-пейвола. Действия по удержанию доступны только в воронках отмены — добавить их в воронку, обслуживающую веб-пейвол, нельзя. Подробнее о самой воронке читайте в [гайде FunnelFox по воронкам отмены](https://funnelfox.com/docs/dashboard/funnels#cancellation-funnels).

### Получите ID профиля подписчика в FunnelFox \{#get-the-subscribers-funnelfox-profile-id\}

Воронка отмены идентифицирует подписчика по его ID профиля FunnelFox. После покупки веб-подписки FunnelFox записывает этот ID в [профиль](profiles-crm) Adapty как пользовательский атрибут `fnlfx_profile_id`, вместе с `fnlfx_funnel_id`, `fnlfx_session_id`, `vendor_profile_id` и `vendor`.

FunnelFox записывает эти атрибуты один раз — при первой покупке веб-подписки. Последующие покупки не изменяют их. Для расходуемой покупки FunnelFox записывает их только в том случае, если у элемента оформления заказа есть пользовательский уровень доступа.

Ваше приложение считывает `fnlfx_profile_id` из `customAttributes` профиля пользователя. Чтобы увидеть это же значение в Adapty, откройте **Profiles** и найдите профиль пользователя.

:::note
Adapty хранит до 30 пользовательских атрибутов на профиль. Когда профиль заполнен, Adapty удаляет лишние атрибуты без возврата ошибки, и FunnelFox больше их не отправляет. Если ваше приложение задаёт собственные пользовательские атрибуты, оставьте место для пяти атрибутов FunnelFox.
:::

### Открытие флоу из приложения \{#open-the-funnel-from-your-app\}

Приложение само формирует URL отмены подписки. Он не указывается в поле **Web paywall URL** — это поле предназначено для пейвола, который продаёт продукт, и Adapty добавляет к нему `adapty_profile_id`, а не `fpid`.

Объедините опубликованный URL флоу отмены с `fnlfx_profile_id` подписчика:

```
https://<your-project>.fnlfx.com/cancel?fpid=<fnlfx_profile_id>
```

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

Пользователи могут закрыть страницу в любой момент, в том числе после того, как флоу отменит подписку. Не воспринимайте их возврат в приложение как подтверждение. Запросите профиль, чтобы получить актуальное состояние. Отменённая подписка сохраняет уровень доступа до конца оплаченного периода.