如何创建隐藏'payment_method_nonce'由brainstree.js输入

How to create hidden 'payment_method_nonce' input by braintree.js?

本文关键字：nonce method brainstree 输入 js 何创建 payment 隐藏 创建      更新时间：2023-09-26

我这样配置brainstree.js：

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

正如我从developers.raintree的文档中了解到的，您需要向服务器发送一个名为"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>

知道我的错在哪里吗？

我在Braintree的SDK团队工作。

Drop-In集成要求表单中存在button或type=["submit"]元素。我尝试了您的集成，并能够通过添加<button>Pay</button>元素将payment_method_nonce值发送到我的服务器。尝试一下，看看这是否修复了您的集成。

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

相关文章：