在 Capacitor SDK 的自定义付费墙中启用购买功能

本指南介绍如何将 Adapty 集成到您的自定义付费墙中。您可以完全掌控付费墙的实现方式,同时由 Adapty SDK 负责获取产品、处理新购买以及恢复历史购买记录。

本指南面向正在实现自定义付费墙的开发者。 如果您希望以最简便的方式启用购买功能,请使用 Adapty 付费墙编辑工具。使用付费墙编辑工具,您可以在无代码可视化编辑器中创建付费墙,Adapty 会自动处理所有购买逻辑,您无需重新发布应用即可测试不同的设计方案。

开始之前

设置产品

要启用应用内购买,您需要了解三个关键概念:

  • 产品 – 用户可以购买的任何内容(订阅、消耗型商品、永久授权)
  • 付费墙 – 定义向用户展示哪些产品的配置。在 Adapty 中,付费墙是获取产品的唯一方式,但这种设计让您无需修改应用代码即可调整产品、价格和优惠。
  • 版位 – 在应用中展示付费墙的位置和时机(如 mainonboardingsettings)。您在看板中为版位配置付费墙,然后在代码中通过版位 ID 请求对应的付费墙。这样便于运行 A/B 测试并向不同用户展示不同的付费墙。

即使您使用自定义付费墙,也需要理解这些概念。它们本质上只是您管理应用内销售产品的方式。

要实现自定义付费墙,您需要创建一个付费墙并将其添加到版位中。此配置允许您获取产品。要了解在看板中需要执行哪些操作,请参阅此处的快速入门指南。

管理用户

您可以选择在后端使用身份验证,也可以不使用。

但是,Adapty SDK 对匿名用户和已识别用户的处理方式不同。请阅读用户身份识别快速入门指南,以了解具体细节并确保您正确处理用户信息。

第 1 步. 获取产品

要为自定义付费墙获取产品,您需要:

  1. 通过将版位 ID 传递给 getPaywall 方法来获取 paywall 对象。
  2. 使用 getPaywallProducts 方法获取该付费墙的产品数组。
import { adapty } from '@adapty/capacitor';
import type { AdaptyPaywall, AdaptyPaywallProduct } from '@adapty/capacitor';

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 方法并传入所选产品。该方法将处理购买流程并返回更新后的用户画像。

import { adapty } from '@adapty/capacitor';
import type { AdaptyPaywallProduct, AdaptyPurchaseResult } from '@adapty/capacitor';

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 同步并返回更新后的用户画像。

import { adapty } from '@adapty/capacitor';
import type { AdaptyProfile } from '@adapty/capacitor';

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 集成的购买处理方案。

接下来,检查用户是否已完成购买,以决定是否展示付费墙或开放付费功能的访问权限。