Question

我正在使用 django 应用程序，其中 braintree 用于付款目的。我使用的braintree版本是 3.13.0 。我在braintree应用程序旁边使用 braintree.js dropin-ui 。

我尝试使用自定义表单添加付款方式，其中包含字段＆＃39; cardholder_name＆＃39;＆＃39; number＆＃39;和＆＃39;到期日期＆＃39;。当我点击“添加付款方式”时，链接，发送服务器端请求以获取客户端令牌。使用它我设置braintree，如下所示：

function setup_braintree(){
$.ajax({
        url:'/get_token/', 
        type: 'GET',
        datatype:'json',
        data: {
            payment_freq: 1,
        },
        success: function(d) {
            if (d !== null){
                $('#dropin-container').html('');
                braintree.setup(d.client_token, "dropin", {
                    container: "dropin-container"
                });


            }
         } 
});}

我的表格如下：

<form name="PaymentMethodForm" id="PaymentMethodForm" action="/payment_method/add/" method="POST">{% csrf_token %}
    <div id="dropin-container" style="display:none;">Loading...</div>
    <div class="form-group">
      <label for="id_name_on_card">Name On Card:</label>
      <input type="text" id="id_name_on_card" name="name_on_card" value="" class="form-control"/>
    </div>
    <div class="form-group">
      <label for="id_card_number">Card Number:</label>
      <input type="text" id="id_card_number" name="card_number" value=""  class="form-control"/>
    </div>
    <div class="form-group">
      <label for="id_expiration_date">Expiration Date:</label>
      <input type="text" id="id_expiration_date" name="expiration_date" value=""class="form-control"/>
    </div>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    <button type="button" id="submit" class="btn btn-default">Save</button>
    <input type="submit" class="cool-fc button swagbutton" value="Submit" id="submitbutton" name="submitbutton" style="display:none">
  </div>
  </form>

根据文档，隐藏了＆＃39;字段＆＃39; payment_method_nonce＆＃39;已创建，但其值为null。

当我提交表单时，需要提供nonce＆＃39;正在返回错误。这可能是什么问题？我的服务器代码如下：

result = braintree.PaymentMethod.create({
    "customer_id": request.user.username,
    "payment_method_nonce": request.POST['payment_method_nonce'],
    "number":request.POST['card_number'],
    "cardholder_name":request.POST['name_on_card'],
    "expiration_date":request.POST["expiration_date"],
    "options":{
        "verify_card":True
    }
})

还有dropin-ui中的选项可以添加付款方式＆＃39;不使用自定义表单？

提前致谢。

Answer 1

_{完全披露：我在Braintree工作。如果您有任何其他问题，请随时联系support。}

对于Drop-in，您不需要包含任何输入标记，braintree.js将使用braintree.setup(...)中指定的div内的表单输入呈现iframe。然后，当用户提交此表单时，服务器端应该可以使用付款方式现时。

您的表单应该只是

<form name="PaymentMethodForm" id="PaymentMethodForm" action="/payment_method/add/" method="POST">{% csrf_token %} 

  <div id="dropin-container"></div>

  <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    <button type="button" id="submit" class="btn btn-default">Save</button>
    <input type="submit" class="cool-fc button swagbutton" value="Submit" id="submitbutton" name="submitbutton" style="display:none">
  </div>
</form>

如果您希望对样式的更多控制仍然具有最简单的PCI合规性，我会看一下Hosted Fields。

希望这有帮助！

Braintree payment payment_method_nonce值为null

1 个答案: