Включение покупок в вашем кастомном пейволе в Capacitor SDK

В этом гайде описано, как интегрировать Adapty в ваши кастомные пейволы. Сохраните полный контроль над реализацией пейвола, пока Adapty SDK получает продукты, обрабатывает новые покупки и восстанавливает предыдущие.

Этот гайд предназначен для разработчиков, реализующих кастомные пейволы. Если вы хотите наиболее простой способ включить покупки, используйте Adapty Paywall Builder. С Paywall Builder вы создаёте пейволы в визуальном редакторе без кода, Adapty автоматически обрабатывает всю логику покупок, и вы можете тестировать разные дизайны без повторной публикации приложения.

Перед началом работы

Настройка продуктов

Чтобы включить встроенные покупки, нужно понять три ключевых концепции:

  • Продукты — всё, что пользователи могут купить (подписки, расходуемые покупки, пожизненный доступ)
  • Пейволы — конфигурации, определяющие, какие продукты предлагать. В Adapty пейволы — единственный способ получить продукты, но такой подход позволяет изменять продукты, цены и офферы без изменения кода приложения.
  • Плейсменты — где и когда показывать пейволы в вашем приложении (например, main, onboarding, settings). Вы настраиваете пейволы для плейсментов в дашборде, а затем запрашиваете их по ID плейсмента в коде. Это упрощает проведение A/B-тестов и показ разных пейволов разным пользователям.

Убедитесь, что вы понимаете эти концепции, даже если работаете с кастомным пейволом. По сути, это просто ваш способ управлять продуктами, которые вы продаёте в приложении.

Для реализации кастомного пейвола вам нужно создать пейвол и добавить его в плейсмент. Эта настройка позволяет получать ваши продукты. Чтобы понять, что нужно сделать в дашборде, следуйте этому гайду по быстрому старту.

Управление пользователями

Вы можете работать как с аутентификацией на бэкенде, так и без неё.

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

Шаг 1. Получите продукты

Чтобы получить продукты для вашего кастомного пейвола, нужно:

  1. Получить объект paywall, передав ID плейсмента в метод getPaywall.
  2. Получить массив продуктов для этого пейвола с помощью метода getPaywallProducts.

async function loadPaywall() {
  try {
    const paywall: AdaptyPaywall = await adapty.getPaywall({
      placementId: 'YOUR_PLACEMENT_ID'
    });

    const products: AdaptyPaywallProduct[] = await adapty.getPaywallProducts({
      paywall
    });

    // Use products to build your custom paywall UI
  } catch (error) {
    // Handle the error
  }
}

Шаг 2. Принимайте покупки

Когда пользователь нажимает на продукт в вашем кастомном пейволе, вызовите метод makePurchase с выбранным продуктом. Это запустит процесс покупки и вернёт обновлённый профиль.


async function purchaseProduct(product: AdaptyPaywallProduct) {
  try {
    const result: AdaptyPurchaseResult = await adapty.makePurchase({ product });

    if (result.type === 'success') {
      // Purchase successful, profile updated
    } else if (result.type === 'user_cancelled') {
      // User canceled the purchase
    } else if (result.type === 'pending') {
      // Purchase is pending (e.g., user will pay offline with cash)
    }
  } catch (error) {
    // Handle the error
  }
}

Шаг 3. Восстановите покупки

Сторы требуют, чтобы все приложения с подписками предоставляли пользователям возможность восстановить покупки.

Вызовите метод restorePurchases, когда пользователь нажмёт кнопку восстановления. Это синхронизирует историю покупок с Adapty и вернёт обновлённый профиль.


async function restorePurchases() {
  try {
    const profile: AdaptyProfile = await adapty.restorePurchases();
    // Restore successful, profile updated
  } catch (error) {
    // Handle the error
  }
}

Следующие шаги

Есть вопросы или возникли проблемы? Загляните на наш форум поддержки, где можно найти ответы на распространённые вопросы или задать свой. Наша команда и сообщество всегда готовы помочь!

Ваш пейвол готов к отображению в приложении. Протестируйте покупки в песочнице App Store или в Google Play Store, чтобы убедиться, что вы можете выполнить тестовую покупку через пейвол. Чтобы увидеть, как это работает в готовой к продакшену реализации, ознакомьтесь с App.tsx в нашем примере приложения, который демонстрирует обработку покупок с правильной обработкой ошибок, состояниями загрузки и полной интеграцией SDK.

Далее проверьте, завершил ли пользователь покупку, чтобы решить, показывать ли пейвол или открыть доступ к платным функциям.