在Stripe/Checkout中預填充電子郵件地址

Question

我在網站上使用Stripe/Checkout以接受付款。條紋是相當簡單的用這種方式，因爲他們給下面的腳本在網頁中嵌入：

<form id="monthly" action="/subscribe" method="POST"> 
    <script 
    src="https://checkout.stripe.com/checkout.js" class="stripe-button" 
    data-key="pk_test_xxxxxxxxx" 
    data-image="http://mywebsite.com/assets/img/logo_raw.png" 
    data-name="My Website" 
    data-description="Monthly Subscription" 
    data-amount="6900" 
    data-email="email@example.com" 
    data-allow-remember-me=false 
    data-label="Subscribe" > 
    </script> 
</form> 

我希望能夠做的是預先填充的電子郵件地址值（數據電子郵件= 「email@example.com」）與我的custom.js jQuery腳本中的變量相關聯。我精通jQuery，但我可以用jQuery修改這個嵌入式腳本嗎？

Answer 1

您需要使用custom integration，做這樣的事情：

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

<button id="customButton">Purchase</button> 

<script> 
    var email = "customer@example.com"; // or use jQuery to dynamically populate the variable 

    var handler = StripeCheckout.configure({ 
    key: 'pk_test_...', 
    image: 'https://stripe.com/img/documentation/checkout/marketplace.png', 
    locale: 'auto', 
    token: function(token) { 
     // You can access the token ID with `token.id`. 
     // Get the token ID to your server-side code for use. 
    } 
    }); 

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

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