未处理的拒绝（TypeError）：stripe.redirectToCheckout 不是 function

Question

我正在尝试为网站实施 Stripe 结帐。 不幸的是，Stripe 文档非常不完整。 我有：

import React from 'react';
import { loadStripe } from '@stripe/stripe-js';

const stripe = loadStripe('pk_test_key');

const handleClick = async (event) => {
  stripe.redirectToCheckout({
    lineItems: [
      {price: 'price_something', quantity: 1},
    ],
    mode: 'subscription',
    successUrl: 'https://example.com/success?session_id={CHECKOUT_SESSION_ID}',
    cancelUrl: 'https://example.com/cancel',
  }).then(function(result){
    alert(result);
  });
};

export default function Stripe(){
  return (
    <button role="link" onClick={handleClick}>
      Checkout
    </button>
  );
}

我单击按钮并收到错误消息： Unhandled Rejection (TypeError): stripe.redirectToCheckout is not a function

我的钥匙是正确的，但我在他们的文档或其他任何地方都找不到任何信息来解决这个问题。 谢谢！

Answer 1

据我了解loadStripe返回Promise所以尝试等待它解决：

const handleClick = async (event) => {
  const stripe = await loadStripe('pk_test_key');

  stripe.redirectToCheckout({
    // ...
  })
};

Answer 2

它有助于检查您是否使用了正确的 await 关键字，因为我错过了该关键字并想知道错误在哪里 2 小时