在 Web 上实现 Stripe：未捕获的 ReferenceError：未定义 StripeCheckout答案

【问题标题】：Implementing Stripe on Web: Uncaught ReferenceError: StripeCheckout is not defined在 Web 上实现 Stripe：未捕获的 ReferenceError：未定义 StripeCheckout
【发布时间】：2019-06-06 09:52:19
【问题描述】：

我正在尝试在我的网络应用中实施 Stripe 支付。但是，当使用示例代码时，我收到以下 javascript 错误：

未捕获的 ReferenceError：未定义 StripeCheckout

代码是这样的：

    <script type="text/javascript" src="https://js.stripe.com/v2/"></script>

    <script>
      Stripe.setPublishableKey('pk_test_HnjFihOWwYTWnnsTLnZTmbgv');

      var handler = StripeCheckout.configure({
        key: 'pk_test_HnjFihOWwYTWnnsTLnZTmbgv',
        image: '/img/documentation/checkout/marketplace.png',
        token: function(token) {
          // Use the token to create the charge with a server-side script.
          // You can access the token ID with `token.id`
        }
      });

      $('#customButton').on('click', function(e) {
        // Open Checkout with further options
        handler.open({
          name: 'Demo Site',
          description: '2 widgets',
          amount: 2000
        });
        e.preventDefault();
      });

      // Close Checkout on page navigation
      $(window).on('popstate', function() {
        handler.close();
      });
    </script>

知道为什么我会收到错误消息吗？谢谢你。

【问题讨论】：

那么回答您的问题，您会收到错误消息，因为 js 文件 https://js.stripe.com/v2/ 中不存在全局 StripeCheckout。
checkout.stripe.com/checkout.js
看起来您已经将 Stripe.js 示例的一部分塞进了常规的 Checkout 示例中。如果您回头查看 Checkout 的示例，您会看到它加载了不同的脚本并且没有 Stripe.setPublishableKey 行。

标签： javascript jquery stripe-payments

【解决方案1】：

StripeCheckout 建立在 Stripe 之上。您需要包含定义 StripeCheckout 的 js 文件。

<script src="https://checkout.stripe.com/checkout.js"></script>

请参阅此处的文档： https://stripe.com/docs/checkout#integration-custom

【讨论】：

【解决方案2】：

只有在下载了 checkout.js 文件并编译了您的 javascript 文件后，才应执行可发布的关键行，对于我的项目，这是可行的

<script type="text/javascript" src="https://js.stripe.com/v2/">

$(function(){

  Stripe.setPublishableKey('<%= Rails.configuration.stripe[:PUBLISHABLE_KEY] %>');

});

</script>

要对此进行测试，请使用浏览器中的开发人员工具打开一个控制台，并在页面加载后，如果控制台返回对您页面中表单的引用，则粘贴 $('#payment-form') 然后它可以工作。

我已将它放在我的应用程序的表单页面中，它解决了这个错误，当它包含在我的 javascript 文件中时，甚至包含在 on ready 事件中，它导致了与您遇到的相同的错误

【讨论】：