如何仅在支付成功时保存Stripe支付方式（无需额外调用）

这个问题我之前也碰到过——save_payment_method: true确实会不管支付成不成都把卡片绑到客户身上，挺坑的。不过Stripe其实提供了更合理的方式来实现你要的需求：仅在支付成功时自动保存支付方法，而且不需要额外调用接口。

核心思路：用setup_future_usage替代save_payment_method #

save_payment_method的设计就是无条件保存支付方式，不管支付结果；而setup_future_usage是绑定在「支付成功」这个前提上的——当你在创建Payment Intent时指定这个参数，并且支付最终成功，Stripe会自动把该支付方法关联到对应的客户账户里；如果支付失败，就不会有任何保存操作。

具体实现步骤 #

1. 后端创建Payment Intent时配置关键参数

在你创建Payment Intent的后端代码里，需要指定两个核心参数：

• customer: 要关联的客户ID（如果还没有客户，得先调用stripe.customers.create()创建一个）
• setup_future_usage: 可选值为off_session（用于后续无用户在场的自动扣款）或on_session（用于后续用户在场的再次支付），根据你的业务场景选就行。

举个Node.js的例子：

const stripe = require('stripe')('你的密钥');

const createPaymentIntent = async () => {
  const paymentIntent = await stripe.paymentIntents.create({
    amount: 1000, // 单位：分，这里是10美元
    currency: 'usd',
    customer: 'cus_XXXXXX', // 替换成你的客户ID
    setup_future_usage: 'off_session', // 根据需求选值
    // 其他必要参数，比如metadata等
  });
  return paymentIntent.client_secret;
};

2. 前端调用handleCardPayment时移除save_payment_method参数

前端不需要再设置save_payment_method: true了，直接调用handleCardPayment即可：

try {
  const result = await this.stripe.handleCardPayment(
    clientSecret, // 从后端获取的client_secret
    cardElement,
    {
      // 这里可以添加支付方法的额外信息，比如账单地址
      payment_method_data: {
        billing_details: {
          name: '客户姓名',
          email: 'customer@example.com'
        }
      }
    }
  );

  if (result.error) {
    // 支付失败：处理错误，此时支付方法没有被保存
    alert(`支付失败：${result.error.message}`);
  } else {
    // 支付成功：支付方法已经自动保存到客户账户
    console.log('支付成功！已保存支付方法ID：', result.paymentIntent.payment_method);
    // 这里可以做后续的业务逻辑，比如跳转到成功页面
  }
} catch (err) {
  console.error('处理支付时出错：', err);
}

为什么这个方案可行？ #

当Payment Intent带有setup_future_usage和customer参数时，Stripe的逻辑是：

• 如果支付成功：自动将本次使用的支付方法标记为该客户的「已保存支付方法」，你可以在Stripe后台的客户详情里看到，后续也可以用这个支付方法发起扣款。
• 如果支付失败：不会有任何支付方法被保存，完全符合你的需求。

而且整个过程不需要额外调用任何接口，Stripe已经帮你处理好了保存的逻辑。

内容的提问来源于stack exchange，提问作者Tobi