如何通過braintree.js創建隱藏的'payment_method_nonce'輸入？

Question

我配置braintree.js這樣的：

braintree.setup(
     brainTreeClientToken= 'token_from_server' 
     'dropin', { 
      container: 'brainTreeDropin', 
      form: 'checkout' 
     }); 
</script> 

當我從developers.braintree的文檔明白了，你需要發送一個名爲「payment_method_nonce」到你的服務器的請求PARAM，但它是不在請求中。順便說一下，我在瀏覽器控制檯中看不到任何js錯誤。 這是我的表格：

<form id="checkout" method="post" 
     th:action="...."> 
    <div id="brainTreeDropin"></div> 
    <div > 
     <div class="form-group"> 
      <label for="cardNumber">Credit Card Number</label> 
      <input data-braintree-name="number" ..other details.. "/> 
     </div> 
     <div class="form-group"> 
      <label for="cardHolder">Name on Card</label> 
      <input data-braintree-name="cardholder_name" ..other details.. /> 
     </div> 
    </div> 
    <div > 
     <div class="form-group"> 
      <label for="cvc">Security Code(CVC)</label> 
      <input data-braintree-name="cvv" ..other details.. /> 
     </div> 
     <div class="form-group"> 
      <label for="expDate">Expiration Date</label> 
      <input data-braintree-name="expiration_date" ..other details.. /> 
     </div> 
    </div> 
</form> 

有什麼想法是我的錯？

Answer 1

我在SDK團隊的Braintree工作。

嵌入式集成需要在表格中存在button或type=["submit"]元素。我嘗試了你的集成，並通過添加一個<button>Pay</button>元素來獲得發送到我的服務器的payment_method_nonce值。試試看看是否可以修復你的集成。

此外，出於好奇，您是否有意在同一form內使用2種信用卡輸入方法？ Drop-In表單包含信用卡的必要字段，您不應該需要註釋輸入data-braintree-name。