javascript - 如何通过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”的请求参数发送到您的服务器，但它不存在于请求中。顺便说一句，我在浏览器控制台中没有看到任何 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

我在 Braintree SDK 团队工作。

直接集成需要 button或type=["submit"]元素出现在表单中。我尝试了您的集成，并获得了 payment_method_nonce通过添加 <button>Pay</button> 发送到我的服务器的值元素。尝试一下，看看是否可以解决您的集成问题。

另外，出于好奇，您是否打算在同一个 form 中拥有 2 种信用卡输入法？ ？ Drop-In 表单包含信用卡的必要字段，您不需要 data-braintree-name带注释的输入。