Tham chiếu không bắt buộcLỗi: Sọc không được xác định - STRIPE ERROR

Question

Tôi đang cố triển khai các phần tử Stripe vào ứng dụng đường ray của mình, nhưng dường như tôi không thể bao gồm chính xác stripe.js. Dưới đây là application.html tôi

<%= tag :meta, name: "stripe-key", content: Figaro.env.stripe_publishable_key %> 
<script type="text/javascript" src="https://js.stripe.com/v3/"</script> 
<script type="text/javascript" src="https://js.stripe.com/v2/"></script> 

JS

var stripe = Stripe($("meta[name='stripe-key']").attr("content")) 
var elements = stripe.elements(); 

var card = elements.create('card', { 
    style: { 
    base: { 
     iconColor: '#999', 
     color: '#505652', 
     lineHeight: '40px', 
     fontWeight: 300, 
     fontFamily: 'Helvetica Neue', 

     '::placeholder': { 
     color: '#CFD7E0', 
     }, 
    }, 
    } 
}); 
// Add an instance of the card UI component into the `card-element` <div> 
card.mount('#card-element'); 

MẪU

<form action="/charge" method="post" id="payment-form"> 
    <div class="form-row"> 
    <label for="card-element"> 
     Credit or debit card 
    </label> 
    <div id="card-element"> 
    </div> 
    <div id="card-errors"></div> 
    </div> 

    <button>Submit Payment</button> 
</form> 

Mỗi lần tôi tải trang tôi nhận được lỗi này trong giao diện điều khiển Uncaught ReferenceError: Stripe is not defined - STRIPE ERROR. Tôi nghĩ rằng nó có một cái gì đó để làm với cách tôi đang tải stripe.js nhưng tôi không chắc chắn?

Answer 1

Tôi nghi ngờ điều đang xảy ra là Stripe.js đang tải SAU theo javascript của riêng bạn. Thử di chuyển Stripe.js lên trên javascript của chính bạn trong tiêu đề.