支付过程中保存付款详情

了解如何接受付款并保存客户的付款详情以备将来购物时使用。

复制页面

用 Stripe Checkout 在您的网站上嵌入预构建的支付表单，让客户保存他们的支付信息，用于未来购物时使用。

设置 Stripe
服务器端

首先，注册一个 Stripe 账户。

用我们的官方库从您的应用程序访问 Stripe API：

创建客户
服务器端

要为将来的付款设置银行卡，就必须将它绑定到 Customer。当客户在您的公司创建账户时，创建 Customer 对象。Customer 对象允许重复使用支付方式并跟踪多笔付款。

成功创建后会返回 Customer 对象。您可以检查客户 id 的对象，并将它的值存储在您的数据库中以供以后检索。

您可以在管理平台的客户页面中找到这些客户。

创建一个 Checkout Session
服务器端

从您的服务器创建一个 Checkout Session，并将 ui_mode 设置为 embedded。您可以使用 line items 配置 Checkout Session，以包括诸如 currency 之类的选项。

您还可以为现有客户创建 Checkout Session，从而用已知联系信息预填 Checkout 字段，并统一该客户的购买记录。

要让客户返回到您网站上托管的自定义页面，请在 return_url 参数中指定该页面的 URL。在 URL 中包含 {CHECKOUT_SESSION_ID} 模板变量，以在返回页面上检索会话的状态。在重定向之前，Checkout 会自动将变量替换为 Checkout Session ID。

阅读更多有关配置返回页面和其他自定义重定向行为的选项。

创建 Checkout Session 后，使用挂载 Checkout 响应中返回的 client_secret。

挂载 Checkout
客户端
服务器端

Stripe.js 是作为 Checkout 的一部分提供的。在您的页面包含 Stripe.js 脚本，方法是将它添加到您的 HTML 文件的 head 部分。接下来，创建一个空的 DOM 节点（容器）用于挂载。

index.html
<head>
  <script src="https://js.stripe.com/v3/"></script>
</head>
<body>
  <div id="checkout">
    <!-- Checkout will insert the payment form here -->
  </div>
</body>

用您的可发布 API 密钥初始化 Stripe.js。

创建一个异步 fetchClientSecret 函数，请求您的服务器创建 Checkout Session 并检索客户端私钥。创建 Checkout 实例时，将该函数传入 options：

index.js
// Initialize Stripe.js
const stripe = Stripe('pk_test_TYooMQauvdEDq54NiTphI7jx'
);

initialize();

// Fetch Checkout Session and retrieve the client secret
async function initialize() {
  const fetchClientSecret = async () => {
    const response = await fetch("/create-checkout-session", {
      method: "POST",
    });
    const { clientSecret } = await response.json();
    return clientSecret;
  };

  // Initialize Checkout
  const checkout = await stripe.initEmbeddedCheckout({
    fetchClientSecret,
  });

  // Mount Checkout
  checkout.mount('#checkout');
}

Checkout 在 iframe 中呈现，该 iframe 通过 HTTPS 连接将支付信息安全地发送给 Stripe。

常见错误

避免将 Checkout 放在另一个 iframe 中，因为有些支付方式需要重定向到另一个页面进行付款确认。

保存支付方式
服务器端

设置完您的嵌入式 Checkout 集成应用后，为您的集成应用选择一个配置，以保存客户所用的支付方式。

默认情况下，用 Checkout 进行一次性付款时所使用的支付方式将来不能再使用。

保存支付方式，以在会话外扣款

通过传递 payment_intent_data.setup_future_usage 实参可以对 Checkout 进行设置，使其保存用于进行一次性付款的支付方式。在您需要捕捉填写的支付方式以便收取滞后费用时（例如取消或未到场费用），这样做非常有帮助。

如果您在 subscription 模式下使用 Checkout， Stripe 会自动保存该支付方式，用来完成今后的付款。使用 setup_future_usage 或 subscription 模式为客户保存的银行卡支付方式在复购时不会在 Checkout 中显示（详见下文）。建议使用自定义文本链接到有关使用保存的支付信息的任何相关条款。

注意

全球隐私法非常复杂、微妙。建议在实施 setup_future_usage 之前咨询您的法律和隐私团队，因为这可能会影响您的隐私合规框架。参考欧洲数据保护委员会发布的指导意见，了解有关保存支付详情的更多信息。

保存支付方式，以在 Checkout 中预先填充

默认情况下，Checkout 使用 Link 为您的客户提供安全地保存和重复使用其支付信息的选项。如果您更喜欢自己管理支付方式，请在创建 Checkout Session 时使用 saved_payment_method_options.payment_method_save，让客户保存他们的支付方式，以备将来购物时在 Checkout 中使用。

在 payment 或 subscription 模式下传递此参数会显示一个可选复选框，让客户显式保存其支付方式以备将来购买时使用。当客户选中此复选框时，Checkout 会使用 allow_redisplay: always 保存支付方式。Checkout 使用该参数来确定将来的购物中是否可以预先填充支付方式。使用 saved_payment_method_options.payment_method_save 时，您无需传入 setup_future_usage 来保存支付方式。

使用 saved_payment_method_options.payment_method_save 时要求提供 Customer。要保存新客户，请将 Checkout Session 的 customer_creation 设置为 always。否则，会话过程中不会保存客户或支付方式。

如果未传入 payment_method_save 或客户不同意保存支付方式，Checkout 仍会保存在 subscription 模式下或使用 setup_future_usage 创建的支付方式。这些支付方式的 allow_redisplay 值为 limited，这可以防止在退货时预先填充它们，并使您遵守卡组织的规则和数据保护法规。了解如何更改这些模式启用的默认行为以及如何更改或覆盖 allow_redisplay 行为。

注意

您可以使用 Checkout 保存银行卡和其他支付方式来进行会话外收款，但 Checkout 仅预填充已保存的银行卡信息。了解如何预填充保存的银行卡信息。要在不进行初始付款的情况下保存支付方式，请在设置模式下使用 Checkout。

支付过程中保存付款详情

了解如何接受付款并保存客户的付款详情以备将来购物时使用。

设置 Stripe服务器端

创建客户服务器端

创建一个 Checkout Session服务器端

挂载 Checkout客户端服务器端