Braintree Dropin UI，如何检测卡片类型？

Question

我正在使用 Braintree Dropin UI，我需要找出卡类型，如 AMEX、VISA 等。

我正在使用 JS + .NET。这是我的付款请求代码：

var request = new TransactionRequest
                {
                    Amount = Math.Round(amount, 2),
                    PaymentMethodNonce = nonce,
                    MerchantAccountId = merchantAccount,
                    Options = new TransactionOptionsRequest
                    {
                        SubmitForSettlement = true
                    }
                };

实际上，在进行交易之前，我需要针对某些特定的卡类型使用特定的merchantAcount。

有没有办法从客户端或 clientToken 使用此 request 或 nonce 获取 PaymentMethod。

我可以在 Braintree 保险库中看到 PaymentMethod 令牌。

如有任何帮助，我们将不胜感激。

提前致谢。

Answer 1

创建交易后，您可以从交易响应对象中获取CardType。 CardType will be in the CreditCard attribute.

如果您使用 Braintree 的 Drop-In UI，它会在用户输入卡号时自动显示卡类型。

如果您想构建自己的，take a look at this JavaScript library for checking card type。

例子

var getCardTypes = require('credit-card-type');

var visaCards = getCardTypes('4111');
console.log(visaCards[0].type);  // 'visa'

var ambiguousCards = getCardTypes('6');
console.log(ambiguousCards.length);       // 3
console.log(ambiguousCards[0].niceType);  // 'Discover'
console.log(ambiguousCards[1].niceType);  // 'UnionPay'
console.log(ambiguousCards[2].niceType);  // 'Maestro'

Answer 2

我是 Braintree 的开发人员。 global configurations 可与 Drop-in 集成一起使用以获取卡片类型。 onPaymentMethodReceived 回调允许您检查有关用户支付方式的一些基本信息。

此回调会拦截表单提交事件，因此您可以将卡片类型添加到表单并将其传递给服务器端代码。 More details about the callback are listed here。下面是一个示例：

 <form id="checkout" method="post" action="/checkout"> 
   <div id="payment-form"></div> 
   <input type="hidden" id="nonce" name="payment_method_nonce" value=""> 
   <input type="hidden" id="card_type" name="card_type" value="">
   <input type="submit" value="Submit"> 
 </form>

然后在您的客户端 Braintree 设置中配置回调：

braintree.setup(clientTokenFromServer, "dropin", {
    container: "payment-form",
    onPaymentMethodReceived: function (obj) {
        var form = document.getElementById("checkout");
        var nonce = document.getElementById("nonce");
        var card_type = document.getElementById("card_type");
        nonce.value = obj.nonce;
        card_type.value = obj.details.cardType;
        form.submit();
    }
});

您会注意到，由于提交事件被拦截，我将付款方式随机数添加到表单中，并在表单上调用 submit() 以完成提交。希望对您有所帮助！

Braintree Dropin UI，如何检测卡片类型？

Braintree Dropin UI, how to detect Card Type?

.net

paypal

braintree

例子