如何为新的条带支付元素创建令牌，就像以前在旧卡元素中完成的那样？

Question

我正在尝试在我的 React 应用程序中使用 stripe 中的新付款元素进行付款处理，但实现的后端要求我发送通过 stripe 收集的标记化付款详细信息，并通过其发送后端将创建费用。我见过的例子都没有这样做，都是直接用 stripe 处理付款。我见过的使用令牌的所有示例似乎不适用于支付元素，仅适用于旧卡元素。

表格如下：

<form id="payment-form" onSubmit={handleSubmit}>
      <LinkAuthenticationElement
        id="link-authentication-element"
        onChange={(e) => setEmail(e.target.value)}
      />
      <PaymentElement id="payment-element" options={paymentElementOptions} />
      
      <button className="mt-5 rounded-lg text-center flex items-center justify-center w-full px-8 py-4 bg-main text-white border-0 text-sm leading-4 font-medium sm:font-semibold sm:text-base sm:leading-[19px]" disabled={isLoading || !stripe || !elements} id="submit">
        <span id="button-text">
          {isLoading ? <div className="spinner" id="spinner"></div> : "Pay now"}
        </span>
      </button>
      {/* Show any error or success messages */}
      {message && <div id="payment-message" className="text-center mt-2">{message}</div>}
    </form>

这是使用卡片元素的旧方法的示例：

stripe.createToken(card).then(function(result) {
      if (result.error) {
        // Inform the user if there was an error.
        var errorElement = document.getElementById('card-errors');
        errorElement.textContent = result.error.message;
      } else {
        // Send the token to your server.
        stripeTokenHandler(result.token);
      }
    });

我尝试了以下方法，但似乎没有效果：

const cardElement = elements.getElement(cardElement);
stripe.createToken(cardElement).then(function(result) {
      if (result.error) {
        // Inform the user if there was an error.
        // var errorElement = document.getElementById('card-errors');
        // errorElement.textContent = result.error.message;
        console.log(result.error.message)
      } else {
        // Send the token to your server.
        console.log(result);
      }
    }).catch((error) => {
      console.log(error);
    });

Answer 1

新的 Stripe PaymentElements 需要使用新的 PaymentIntent 和 PaymentMethods API。我邀请您参考本指南，以便从令牌迁移到付款方式。 你需要改变：

stripe.createToken(
  cardElement
).then(function(token) {
 // Send token to server
});

进入这样的事情：

stripe.confirmCardPayment(
 INTENT_SECRET_FROM_STEP_1,
 {
  payment_method: {card: cardElement}
 }
).then(function(result) {
  if (result.error) {
   // Display error.message in your UI.
  } else {
   // The payment has succeeded
   // Display a success message
  }
 });