# 如何为你的 AI 生成应用添加付费墙

> 为使用 AI 工具构建的应用添加支付门控和付费墙的指南。使用 Dodo Payments 集成结账、管理权益和访问控制，无需从头构建计费系统。
- **Author**: Ayush Agarwal
- **Published**: 2026-03-22
- **Category**: Payments, How-To, AI
- **URL**: https://dodopayments.com/blogs/zh/add-paywall-ai-generated-app

---

你的 AI 生成应用已经有免费用户了。现在，你需要让其中一部分用户付费。付费墙其实只有三部分：负责收款的结账流程、记录谁已付费的权益记录，以及在渲染某项功能前读取该记录的访问检查。把这三点做好，你就永远不需要重构应用。无论你的应用是使用 Cursor、Lovable、Bolt 还是 Replit 构建的，从免费工具转变为创收业务都是一个关键里程碑。许多创始人会因为担心计费逻辑、税务合规和权益管理的复杂性，而推迟这一步。

在 [vibe coding](https://dodopayments.com/blogs/vibe-coding) 的世界里，应用可以以思维般的速度构建，你的变现策略也应该同样灵活。你不应该花费数周时间为订阅编写自定义数据库架构，或研究如何处理全球 VAT。你需要一种能与现有 AI 生成代码配合，并能随着用户群增长而扩展的模式。

本指南将向你展示如何使用 Dodo Payments 实现可靠的付费墙。我们将介绍不同类型的付费墙、如何构建权益体系，以及如何在一个下午内将免费应用转变为付费应用。

## 什么是 Web 应用中的付费墙？

付费墙是一种数字化访问屏障：用户完成付款前，无法访问应用中的特定部分。在现代 Web 应用中，尤其是使用 AI 构建的应用里，付费墙不只是一个"立即购买"按钮。它是一套管理系统，负责决定谁能看到什么、可以使用多少，以及访问权限何时到期。

> 大多数 SaaS 创始人都低估了税务合规的成本。它不仅仅是申报税表，还包括在每个拥有客户的司法管辖区完成注册、结账时计算税款、代缴税款以及做好审计准备。
>
> \- Ayush Agarwal，Dodo Payments 联合创始人兼 CPTO

当你[在线销售软件](https://dodopayments.com/blogs/how-to-sell-software-online)时，付费墙就是你的守门人。它将前端 UI 与后端业务逻辑连接起来。一个实现良好的付费墙会处理三件主要事项：

- **结账**：通过信用卡、Apple Pay 或本地支付方式实际收款的流程。
- **权益**：数据库中的记录，用来说明"用户 A 可以访问功能 B"。
- **访问控制**：代码中的逻辑，在渲染组件或执行 API 调用前检查用户是否拥有相应权益。

通过使用面向 SaaS 的 [MoR（名义商户）](https://dodopayments.com/blogs/merchant-of-record-for-saas)，你可以将税款收取和合规等繁重工作交给服务方处理，专注于应用内的权益逻辑。

## 三种常见的付费墙模式

在编写代码前，你需要决定哪种付费墙模式适合你的 AI 应用。大多数成功的 SaaS 公司会使用以下三种模式中的一种，或将它们组合使用。

### 1. 功能门控

功能门控是[订阅定价模式](https://dodopayments.com/blogs/subscription-pricing-models)中最常见的模式。你免费提供一组基础功能，并将"Pro"功能隐藏在付费墙之后。对于 AI 应用，这可能意味着免费用户可以使用基础 LLM，而付费用户可以使用 GPT-4o 或 Claude 3.5 Sonnet。

要使用 Dodo Payments 实现这一模式，你需要创建一个订阅产品。当用户点击"升级"时，触发[叠加层结账](https://docs.dodopayments.com/developer-resources/overlay-checkout)。付款成功后，你的后端会收到 webhook，并将数据库中用户的 `plan` 字段从 `free` 更新为 `pro`。

### 2. 内容门控

如果你的应用会生成特定资产，例如 AI 图片、研究报告或代码片段，那么内容门控可能更适合。在这种模式下，用户可以查看内容预览，但必须付款才能解锁完整版本或下载高分辨率文件。

这种模式通常通过一次性购买实现。你可以使用 Dodo Payments 为特定的"解锁"事件创建结账会话。在展示数据前，代码会检查当前用户是否购买了对应的内容 ID。这是[接受在线支付](https://dodopayments.com/blogs/how-to-accept-online-payments)的好方法，尤其适合不希望采用持续性订阅的数字商品。

### 3. 用量门控

用量门控非常适合具有较高可变成本的 AI 应用。你可以每月为用户提供 10 次免费的 AI 生成次数。达到上限后，系统会提示他们订阅或购买更多预付额度。这是 [SaaS 嵌入式支付](https://dodopayments.com/blogs/embedded-payments-saas)的核心部分。

实现这种模式需要在数据库中追踪用量。每当用户发起一次 AI 请求，就增加其计数器。当计数器达到上限时，前端显示付费墙，而不是 AI 输出。你可以使用我们的[免费增值计算器](https://dodopayments.com/blogs/freemium-calculator)来决定这些上限，并参考我们的[实现按用量计费](https://dodopayments.com/blogs/implement-usage-based-billing)指南，在开始对超额用量收费后准确计量事件。

## 付费墙流程如何运作

要实现顺畅的集成，了解事件发生的顺序至关重要。以下是使用 Dodo Payments 时典型的付费墙流程。

```mermaid
flowchart TD
    A[User Request] --> B{Check Entitlement}
    B -->|Paid| C[Serve Content/Feature]
    B -->|Not Paid| D[Show Paywall/Checkout]
    D --> E[User Completes Payment]
    E --> F[Dodo Sends Webhook]
    F --> G[Update Database Entitlement]
    G --> H[Redirect to App]
    H --> B
```

这一流程确保你的应用仍然是访问权限的唯一事实来源，而 Dodo Payments 则负责处理交易的复杂性。

## 分步实现指南

下面我们来逐步了解如何为应用添加付费墙。假设你已经拥有一个基础 Web 应用和一个 Dodo Payments 账户。

### 第 1 步：设计免费版与付费版的区别

不要把所有内容都设为门控。你需要展示足够的价值，才能说服用户付费。如果用户还没来得及试用就被挡在整个应用之外，你会看到很高的跳出率。这也是[免费用户不升级的原因](https://dodopayments.com/blogs/why-free-users-dont-upgrade-saas-tactics)之一。

明确决定哪些 H2 标题或功能需要限制。对于 AI 应用，一个合理的划分是：

- **免费版**：每天 5 次生成、基础模型、社区支持。
- **付费版**：无限生成、高级模型、私密模式、优先支持。

### 第 2 步：在 Dodo Payments 中创建产品

登录 Dodo Payments 控制面板并创建新产品。你可以选择一次性付款或订阅。对于大多数 AI 应用来说，月度订阅是[销售数字产品并建立持续收入的最佳平台](https://dodopayments.com/blogs/best-platform-sell-digital-products)。

记下 `product_id`，触发结账时需要用到它。

### 第 3 步：添加结账触发器

最简单的入门方式是使用[叠加层结账](https://docs.dodopayments.com/developer-resources/overlay-checkout)。你可以在 UI 中添加一个简单按钮，调用 Dodo Payments SDK。

```javascript
import { DodoPayments } from "dodopayments-checkout";

// 在应用加载时初始化一次叠加层结账 SDK
DodoPayments.Initialize({
  mode: "live", // 'test' 或 'live'
  displayType: "overlay",
  onEvent: (event) => {
    console.log("Checkout event:", event);
  },
});

const handleUpgrade = async () => {
  // 在服务器上创建结账会话，然后使用其 URL 打开叠加层
  const session = await fetch("/api/create-checkout-session", {
    method: "POST",
    body: JSON.stringify({ productId: "pdt_your_product_id" }),
  }).then((res) => res.json());

  DodoPayments.Checkout.open({ checkoutUrl: session.checkout_url });
};
```

这样用户就能留在你的网站上，这对于保持应用的"vibe"至关重要。

### 第 4 步：处理 webhook 并更新权益

付款成功后，Dodo Payments 会向你的服务器发送 POST 请求。你需要设置 webhook 监听器来捕获这一事件并更新数据库。这是[集成指南](https://docs.dodopayments.com/developer-resources/integration-guide)中最重要的部分。

你应该监听 `subscription.active` 或 `payment.succeeded` 事件。收到事件后，通过用户的电子邮件或自定义元数据字段在数据库中找到该用户，并将其状态更新为 `active`。

### 第 5 步：在受保护路由上检查权益

现在，你需要在前端或后端逻辑中检查这一状态。如果你使用 React，可以为受保护功能创建一个包装组件。

```javascript
const ProtectedFeature = ({ children, userStatus }) => {
  if (userStatus !== "active") {
    return <PaywallComponent />;
  }
  return children;
};
```

这样，即使用户知道某项功能的 URL，也无法在没有有效订阅的情况下使用它。

### 第 6 步：处理订阅取消

订阅不会永久持续。你需要监听 `subscription.cancelled` 或 `subscription.expired` [webhook](https://docs.dodopayments.com/developer-resources/webhooks/intents/webhook-events-guide)。这些事件发生后，应将数据库中用户的状态恢复为 `free`。

Dodo Payments 会自动处理催收流程（重试失败的付款），因此你只需要在最终取消事件到达时执行相应操作。

## 代码示例：React 付费墙组件

下面是一个更完整的示例，展示如何在现代 React 应用中构建付费墙。

```jsx
import React, { useState, useEffect } from "react";
import { DodoPayments } from "dodopayments-checkout";

const AIPaywall = ({ user, onPaymentSuccess }) => {
  const [loading, setLoading] = useState(false);

  useEffect(() => {
    DodoPayments.Initialize({
      mode: "live", // 'test' 或 'live'
      displayType: "overlay",
      onEvent: (event) => {
        if (event.event_type === "checkout.success") {
          onPaymentSuccess();
        }
      },
    });
  }, []);

  const startCheckout = async () => {
    setLoading(true);
    try {
      const session = await fetch("/api/create-checkout-session", {
        method: "POST",
        body: JSON.stringify({ productId: "pdt_pro_plan" }),
      }).then((res) => res.json());

      DodoPayments.Checkout.open({ checkoutUrl: session.checkout_url });
    } catch (error) {
      console.error("Checkout failed", error);
    } finally {
      setLoading(false);
    }
  };

  return (
    <div className="paywall-container">
      <h2>解锁 Pro 功能</h2>
      <p>获取无限次 AI 生成，并使用我们最强大的模型。</p>
      <button onClick={startCheckout} disabled={loading}>
        {loading ? "加载中..." : "立即升级，每月 $19"}
      </button>
    </div>
  );
};

export default AIPaywall;
```

在后端，你可以使用类似下面这样的 webhook 处理器：

```javascript
// pages/api/webhooks/dodo.js
export default async function handler(req, res) {
  const event = req.body;

  if (event.type === "subscription.active") {
    const customerEmail = event.data.customer.email;
    await db.user.update({
      where: { email: customerEmail },
      data: { isPro: true },
    });
  }

  res.status(200).json({ received: true });
}
```

## 打造高转化付费墙的建议

添加技术层面的门控只是成功了一半。你还需要确保用户确实愿意通过这道门。

### 优雅降级

如果支付系统出现故障或 webhook 延迟，不要让应用无法使用。准备一个备用状态。比如，在系统同步期间，允许用户额外生成一次。UI 中的"待处理"状态可以帮助用户建立合理预期，同时等待[订阅](https://docs.dodopayments.com/developer-resources/subscription-integration-guide)完成处理。

### 在付费墙前展示价值

最好的付费墙是"有缝隙的"。它们让用户清楚地看到自己错过了什么。如果你有 AI 图片生成器，可以展示高分辨率输出的模糊版本。如果是文本工具，可以展示第一段内容。这会制造一种只有付款才能消除的心理"痒点"。

### 试用期

Dodo Payments 原生支持试用期。你可以提供 7 天免费试用，让用户养成使用 Pro 功能的习惯。试用结束后，如果用户没有继续订阅，付费墙会自动生效。这是提高犹豫型用户转化率的有效方式。

## 为什么选择 Dodo Payments 为你的 AI 应用提供支持？

使用 AI 构建应用时，你很可能面向全球用户。在 220 多个国家和地区销售意味着要应对众多不同的税法。Dodo Payments 作为你的 [MoR（名义商户）](https://dodopayments.com/blogs/what-is-a-merchant-of-record)，会为你处理 190 多个国家和地区的税款收取、代缴和合规事宜。

你不需要在印度注册 GST，也不需要在欧盟注册 VAT。这些都由我们处理。你只需专注于打造最出色的 AI 功能，并定义付费墙逻辑。我们的[定价](https://dodopayments.com/pricing)透明，没有隐藏费用或月度最低消费，非常适合初创企业和独立开发者。

## 常见问题

### 为 Web 应用添加付费墙最简单的方法是什么？

最简单的方法是使用托管结账或叠加层。你不需要构建复杂的表单，只需添加一个按钮，将用户重定向到结账页面或打开弹窗。付款完成后，使用 webhook 更新用户数据库中的单个布尔字段，例如 `is_paid`。

### 如何在应用中检查用户是否已经付款？

你应该将支付状态存储在自己的数据库中。用户登录时，获取其个人资料并检查 `subscription_status` 或 `has_access` 字段。不要在每次请求中实时调用支付服务商的 API 来检查，因为这会降低应用速度，还可能触及速率限制。

### 我应该在注册前还是注册后要求付款？

对于 AI 应用，通常最好在注册后要求付款。让用户先创建账户，并免费试用一些功能。这样可以建立信任；如果用户没有立即升级，你也可以获取其电子邮件，用于后续营销。

### 可以在付费墙前提供免费试用吗？

可以，提供免费试用是一种非常有效的策略。你可以在 Dodo Payments 中设置带有 7 天或 14 天试用期的订阅。用户会提前输入卡片信息，但在试用期结束前不会被收费。这会显著提高从试用到付费的转化率。

### 订阅取消后，如何处理付费墙访问权限？

订阅取消后，Dodo Payments 会发送 webhook。你应该更新数据库中用户的状态。不过，大多数订阅在当前计费周期结束前仍然有效。请确保逻辑检查 `ends_at` 日期，而不只是检查 `cancelled` 状态，从而为用户提供公平的体验。

## 总结

为 AI 生成应用添加付费墙，是业余项目与商业业务之间的区别。遵循本指南介绍的模式，并使用 Dodo Payments 处理交易的全球复杂性，你今天就可以开始创造收入。

不要让对计费代码的恐惧阻止你。先从简单的功能门控开始，使用叠加层结账提供无缝体验，让你的 AI 应用终于能够为自己的 API 令牌创造收入。

准备好开始变现了吗？[注册 Dodo Payments](https://dodopayments.com)，几分钟内即可上线你的第一个付费墙。
---
- [More Payments articles](https://dodopayments.com/blogs/category/payments)
- [All articles](https://dodopayments.com/blogs)