如何将 Stripe 3D 安全地一次性付款 + 定期订阅放在一个弹出窗口中？

Question

我正在尝试将 3D 安全 Stripe 支付集成到一个“捆绑”中，该“捆绑”具有一次性付款和一年定期付款。

为了实现这一点，我找到的解决方案是使用 stripe.payment_intent 一次性付款，stripe.subscription 每年定期付款。

两种付款方式都有效，但问题是它显示了 2 个弹出窗口（每次付款一个），这让用户感到困惑。

我的问题是如何在 1 个 3D 安全弹出窗口中将两笔付款与总价分组？

这是我的后端：

    const customer = await stripeService.createStripeCustomer(
      name,
      email,
      payment_method,
    )
    const subscription = await stripeService.createStripeSubscription(
      customer,
      stripePriceElement,
      discount,
      trialDays,
    )
      
    let status = subscription.status
    let client_secret =
      trialDays > 0
        ? null
        : subscription.latest_invoice.payment_intent.client_secret

    if (productIsBundle) {
      try {
        const amount = 4000

        const paymentIntent = await stripeService.createStripePaymentIntent(
          amount,
          payment_method,
          customer,
          model.name,
          model.email,
          product.productName,
        )
        let intent_secret = paymentIntent.client_secret
        let intent_status = paymentIntent.status
        res.status(200).json({
          product: 'bundle',
          client_secret,
          status,
          intent_secret,
          intent_status,
          subscription,
        })
      } catch (error) {
        res.status(200).json({ status: 'Payment Intent failed', error })
      }

and here's the front with 2 card confirmations:

try {
          if (intent_secret) {
            await stripe.confirmCardPayment(intent_secret);
          }
          await stripe
            .confirmCardPayment(client_secret)
            .then(async (result) => {
              if (result.error) {
                setStripeError(result.error.message);
              }
              if (result.paymentIntent?.status === 'succeeded') {
                await axios.post(
                  ${process.env.REACT_APP_BACKEND}/users/payment/success,
                  {
                    modelId: model.id,
                  },
                  token,
                );

Answer 1

您可以 add the one-time payment as a line item on the first Invoice for the Subscription.

而不是为一次性付款使用单独的付款意向

这种方法将允许您的客户在订阅开始时为一张发票支付一次。

如何将 Stripe 3D 安全地一次性付款 + 定期订阅放在一个弹出窗口中？

How can put Stripe 3D secure one time payment + recurring subscription in a single pop up?

node.js

reactjs

stripe-payments

subscription