2013-07-11 80 views
6

Stripe现在提供支付,该支付通过在前端创建银行账户令牌来实现。从那里,令牌被发送到服务器,在那里您使用该银行账户令牌创建了一个收件人对象。从那里你可以在传输中使用这个收件人对象。Stripe.js - 收集收件人信息

虽然我很熟悉,你可以创建custom forms for paymentsstripe.js,当谈到创建收件人的道理,我似乎无法找到比this其他任何文件。

这里是我的问题,我的第一个形式:

<form method="POST" id="inst-form">  

    <div class="form-row"> 
     <label> 
     <span>Bank Location</span> 
      <select data-stripe="country"> 
       <option value="US">United States</option> 
      </select> 
     </label> 
    </div> 

    <div class="form-row"> 
     <label> 
     <span>Routing Number</span> 
      <input type="text" size="9" data-stripe="routingNumber"/> 
     </label> 
    </div> 

    <div class="form-row"> 
     <label> 
     <span>Account Number</span> 
      <input type="text" size="17" data-stripe="accountNumber"/> 
     </label> 
    </div> 


    <button type="submit">Make Recipient!</button> 
</form> 

到目前为止,这三个东西,我从这种形式需要的是国家,routingNumber,并使用accountNumber。让我们看一下使用Javascript,所以我可以用这些字段与Stripe.js:

// Create a handler to manage what Stripe returns. 
    var stripeResponseHandler = function(status, response) { 
    var $form = $('#inst-form'); 
    if (response.error) 
    { 
     alert("Error"); 
     // Not sure how to get these errors. 
     $form.find('button').prop('disabled', false); 
    } 
    else 
    { 
     var token = response.id; 
     $form.append($('<input type="hidden" name="stripeToken" />').val(token)); 
     $form.get(0).submit(); 
    } 
    }; 

    // Now the handler is done, lets use it when the form is submitted. 
    // On form submission execute: 
    jQuery(function($) { 
    $('#inst-form').submit(function(event) { 
     // Get the form object. 
     var $form = $(this); 
     // Disable the submit button to prevent repeated clicks 
     $form.find('button').prop('disabled', true); 
     // Create a token with Stripe 
     Stripe.bankAccount.createToken({ 
     country: $('.country').val(), 
     routingNumber: $('.routingNumber').val(), 
     accountNumber: $('.accountNumber').val(), 
     }, stripeResponseHandler); 
     // Prevent the form from submitting with the default action 
     return false; 
    }); 
    }); 

我的问题是,警报()被触发,这意味着有错误。我查看了API,我不确定如何专门为创建收件人而显示这些错误。对于支付它提供了以下例子:

$(".payment-errors").text(response.error.message); 

注 - 我排除的jQuery/Stripe.js的进口 - 这确实是没问题的。 感谢您的帮助!

回答

3

我的经验是,response.error.message的确是正确的处理方式。

下面是我自己的代码为这个样本:

Stripe.bankAccount.createToken({ 
    country: 'US', 
    routingNumber: bank_routing_number, 
    accountNumber: bank_account_number, 
}, function(status, response) { 
    if (response.error) 
    { 
     console.log(response); 
     alert(response.error.message); 
    } 
    else 
    { 
     var token = response.id; 
     /* send the token to the server along with the withdraw request */ 
    } 
}); 

如果您还没有看到正确的错误,你应该尝试CONSOLE.LOG(Response),并查看线索JavaScript控制台。

下面是一个简单的错误示例重现:

路由号码必须有9位数字

你应该与程序,当然,可以确认您的帐户和路由的数字, Stripe.js提供。这里从他们的资料为准用法示例:

// This will return true, indicating a potentially valid bank 
// routing number. 

Stripe.bankAccount.validateRoutingNumber('111000025') 
Stripe.bankAccount.validateRoutingNumber('110000000') 

// These invalid bank routing numbers will all return false. 

Stripe.bankAccount.validateRoutingNumber('990000000') 
// (Doesn't pass the checksum check.) 
Stripe.bankAccount.validateRoutingNumber('12345') 
Stripe.bankAccount.validateRoutingNumber('mistake') 

这种情况的文档是在这里:https://stripe.com/docs/stripe.js#collecting-bank-account-details

0

只需更改如下表单。其他的事情都很好。 因为您提取的值为$('。country')。val()其中.country表示应该有类。所以只需像下面一样在表单中添加类即可。

<form method="POST" id="inst-form">  

<div class="form-row"> 
    <label> 
    <span>Bank Location</span> 
     <select data-stripe="country" class="country"> 
      <option value="US">United States</option> 
     </select> 
    </label> 
</div> 

<div class="form-row"> 
    <label> 
    <span>Routing Number</span> 
     <input type="text" size="9" data-stripe="routingNumber" class="routingNumber"/> 
    </label> 
</div> 

<div class="form-row"> 
    <label> 
    <span>Account Number</span> 
     <input type="text" size="17" data-stripe="accountNumber" class="accountNumber"/> 
    </label> 
</div> 

<button type="submit">Make Recipient!</button>