javascript - Uncaught ReferenceError : StripeCheckout is not defined in ERB

Question

我正在将 stripe 集成到我的 RoR 应用程序中，当我尝试提交测试凭证时出现以下错误:

 Uncaught ReferenceError: StripeCheckout is not defined

这种行为特别奇怪，因为如果我只是刷新/重新加载页面并重复完全相同的步骤并提交相同的测试凭据，则不再有任何错误并且应用程序按预期完美运行，因此付款成功完成。

我在这里很困惑。关于如何解决这个奇怪的错误的任何想法？谢谢!

app/views/pins/_details.html.erb

    <aside id="details-aside" class="col-sm-4">
        <!-- <a id="btn-buy" href="receipt.html" class="btn btn-success btn-lg btn-block"><b>I want this!</b></a> -->                 

      <% if @pin.user = current_user %>

          <%= form_tag charges_path, id: 'chargesForm' do %>
              <script src="https://checkout.stripe.com/checkout.js"></script>
              <%= hidden_field_tag 'stripeToken' %>
              <%= hidden_field_tag 'stripeEmail' %>  
              <button id="btn-buy" type="button" class="btn btn-success btn-lg btn-block"><span class="glyphicon glyphicon-heart"></span>   I want this!</button>

              <script>
                  var handler = StripeCheckout.configure({
                    key: '<%= Rails.configuration.stripe[:publishable_key] %>',
                    token: function(token, arg) {
                      document.getElementById("stripeToken").value = token.id;
                      document.getElementById("stripeEmail").value = token.email;
                      document.getElementById("chargesForm").submit();
                    }
                  });
                   document.getElementById('btn-buy').addEventListener('click', function(e) {
                    handler.open({
                      name: 'OMG! <%= @pin.manufacturer %>',
                      description: '<%= @pin.description %>',
                      amount: 1000
                  });
                  e.preventDefault();
                 })
              </script>
          <% end %>

      <% else %>

          <%= link_to 'I want this!', new_user_registration_path, class: "btn btn-success btn-lg btn-block" %>

      <% end %>

    <br><br/>

        <ul id="details-infobox" class="list-group">
          <li class="list-group-item active clearfix">DETAILS</li>
          <li class="list-group-item">
            <p><strong>Description:</strong>   <%= @pin.description %></p></li>
          <li class="list-group-item clearfix">
            <span class="pull-left content-qualifier"><b>Price:</b></span>
            <span class="pull-right"><%= @pin.model %></span>
          </li>
        </ul>
    </aside>

</section>

Answer 1

请添加以下链接以查看文件:

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

参见引用资料:参见此处的文档:https://stripe.com/docs/checkout#integration-custom

第二个选项，如果仍然没有加载:

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

$(function(){

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

});

</script>