Braintree Dropin形式問題-未生成隨機數字符串

Question

我正在嘗試使用braintree的dropin 形式 ，但是會產生奇怪的行為。

我可以將表格成功放置在視圖中：

<form id="createTransactionForm" method="post" action="#">
    <div id="payment-form"></div>
    <input type="submit" value="Test - Pay">
</form>

<script>

    var braintreeToken = @Html.Raw(Json.Encode(Model.brainTreeToken));

    braintree.setup(
        braintreeToken,
        "dropin", {
            container: "payment-form"
        });

    ...

結果如下：

他們在文檔 （第3段）中指出braintree.js will add a hidden input named payment_method_nonce to your form 。

在我的控制器上，我有一個action方法來捕獲表單集合，並且表單集合中有一個payment_method_nonce鍵，其中有一個空字符串作為值，但沒有其他鍵，這里沒有其他表單字段被捕獲。 如上圖所示，我期望的是卡號和有效期。

使用檢查器，我發現braintree dropin創建具有嵌套形式的HTML結構：

我的問題是，如何使用braintree dropin表單並在action方法中捕獲其所有表單輸入值？

編輯

好的，因此感謝@MikeMiller，我了解到我不需要在controller方法中捕獲CC值，只需捕獲據推測是由它們生成的現時字符串即可。 但是，我得到一個空字符串。

根據他的建議，我嘗試將action屬性的特定值添加到表單中：

<form id="createTransactionForm" method="post" action="@Url.Action("MyMethod", "MyController")">

但是結果是一樣的，隨機數為空字符串。

Answer 1

我讓我使用以下代碼（Laravel5刀片）。 我的問題是使用jQuery提交表單-表單中沒有按鈕元素，無法填充現時值。

<form id="checkout" method="post" action="{{URL('admin/checkout')}}">
<div id="payment-form"></div>
<br>
<div class="input-group">
    <div class="input-group-btn" >
        <div class="btn-group">
            <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown" style="width:50px">
                <span data-bind="label" id="currency">&pound;</span>&nbsp;<span class="caret"></span>
            </button>
            <ul class="dropdown-menu" role="menu" style="min-width:50px">
                <li style="width:50px"><a href="GBP">&pound;</a></li>
                <li style="width:50px"><a href="USD">&dollar;</a></li>
                <li style="width:50px"><a href="EUR">&euro;</a></li>
            </ul>
        </div>
    </div>
    <input type="text" name="amount" id="amount" class="form-control" />


    <div class="input-group-btn">
        <button role="submit" class="btn  btn-primary btn-block" id="submit">Make Payment</button>
    </div>
</div>
</form>
<script src="https://js.braintreegateway.com/v2/braintree.js"></script>
<script>
  braintree.setup("@braintreeClientToken", "dropin", {
    container: "payment-form",
    form: 'checkout'
  });
</script>

Answer 2

當您得到一個空的隨機數時，我遇到了同樣的麻煩。 但是，就我而言，我正在執行“自定義”而不是“直接執行”。 我在各種情況下都進行了很多測試，例如從儀表板創建靜態令牌化令牌，或者在頁面加載時即時生成一個令牌。 我懷疑，他們采取了一些反欺詐措施，這會造成奇怪的情況，即使表單驗證例程失敗，表單也不管提交什么。 或者，表單提交，您將不會得到隨機數。 這些文檔在這方面也非常令人困惑。 所以，這就是我最終要解決的問題。 他們在文檔中沒有告訴您的是onPaymentMethodReceived僅在表單提交操作上調用。 我做出的另一個顯着發現是，如果我使用以下代碼並將<input type="hidden" name="payment_method_nonce" id="payment_method_nonce" />到表單中，然后替換$('#token')行下面的調用來更新payment_method_nonce隱藏字段-Braintree API會在表單提交之前立即刪除它！ 因此，解決此問題的方法是將隱藏字段重命名為“ token”，然后在PHP的表單提交代碼中，我可以處理$_POST['token']而不是$_POST['payment_method_nonce'] ，但將其視為隨機數。

function invalidForm(){
    // use the Stripe or Braintree credit card form validator and any other form validations you want here
    // Braintree: https://github.com/braintree/card-validator
    // Stripe: https://github.com/stripe/jquery.payment
    // return a string value of the problem
    return '';
}

jQuery(document).ready(function(){

    $('FORM#checkout').append('<input type="hidden" id="token" name="token" />');
    // Generate the static client token from your dashboard > Account > My User > 
    // Authorizations > Tokenization Keys
    var clientToken = 'sandbox_555555_555555555555';
    braintree.setup(clientToken, 'custom', {
        id:'checkout',
        onPaymentMethodReceived: function (paymentMethod) {
            $('#btnPurchase').addClass('disabled').attr('disabled');
            var sErr = invalidForm();
            if (sErr) {
                alert(sErr); // obviously do something better than this
                $('#btnPurchase').removeClass('disabled').removeAttr('disabled');
                return false;
            } // else...
            $('#token').val(paymentMethod.nonce);
            $('FORM#checkout').submit();
            return true;
        }
    });
});