如何在不使用Stripe的UI层的情况下获取客户端令牌？

Question

我有以下php页面，效果很好：

<html>
<head>
    <script src="https://checkout.stripe.com/checkout.js"></script>
    <script>
        var handler = StripeCheckout.configure({
          key: '<?=$stripePublicKey?>',
          image: 'https://stripe.com/img/documentation/checkout/marketplace.png',
          locale: 'auto',
          token: function(token) {
            // You can access the token ID with `token.id`.
            // Get the token ID to your server-side code for use.
            console.log("token.id: " + token.id);
            console.log("token: " + token);
          }
        });

        function init(){
            document.getElementById('customButton').addEventListener('click', function(e) {
                // Open Checkout with further options:
                handler.open({
                    name: 'TruckerCert',
                    description: 'Buy Certs',
                    amount: 2000
                });
                e.preventDefault();
            });

            // Close Checkout on page navigation:
            window.addEventListener('popstate', function() {
              handler.close();
            });
        }
    </script>
</head>
<body onload="init()">
<h1>Stripe Token Test</h1>
<button id="customButton">Purchase</button>
</body>
</html>

它可以工作并产生以下JSON：

{
  "id": "tok_1E255j2*****wC135im",
  "object": "token",
  "card": {
    "id": "card_1E255j2H1*****RGS4Kqc",
    "object": "card",
    "address_city": null,
    "address_country": null,
    "address_line1": null,
    "address_line1_check": null,
    "address_line2": null,
    "address_state": null,
    "address_zip": null,
    "address_zip_check": null,
    "brand": "Visa",
    "country": "US",
    "customer": null,
    "cvc_check": "pass",
    "dynamic_last4": null,
    "exp_month": 12,
    "exp_year": 2021,
    "fingerprint": "3nk5B*****29xV",
    "funding": "unknown",
    "last4": "1111",
    "metadata": {
    },
    "name": "her*******@gmail.com",
    "tokenization_method": null,
    "type": "Visa"
  },
  "client_ip": "67.***.***.17",
  "created": 1549754315,
  "email": "her********@gmail.com",
  "livemode": false,
  "type": "card",
  "used": false
}

这就是所有预期。 问题是，我可以找到提交信用卡号和有效日期并接收JSON的唯一方法是通过用户界面。 例如，当我单击customButton ，将出现以下对话框：

我不想使用他们的抄送表格。 我有自己的抄送表格。 我想使用自己的表单，向Stripe的API端点发送ajax请求，并如上所述接收回JSON。 我已经梳理了Stripe的在线文档一个小时，找不到任何方法可以做到这一点。

怎么做？

Answer 1

您提到的产品称为Stripe Checkout ，可让您安全地收集卡的详细信息，而无需构建自己的付款表格。

由于您已经提到已经拥有付款表格，尽管应该改为查看Stripe Elements 。 这样，您就可以设计和设置自己的付款表单，同时仍然满足最低的PCI合规性要求SAQ A，如此处所述。

您仍然可以在此处找到多个付款表单示例和相应的代码： https : //stripe.github.io/elements-examples/

Answer 2

Stripe.js版本2支持此功能。 在撰写本文时，您可以在此处查看旧文档。 如果我不得不猜测Stripe.js v2将完全贬值，并在某些时候不再使用。 因此，尽管您可以轻而易举地使用它，但是它已经贬值了，您必须问自己是否值得在将来重写它。 由于您当前正在构建它，因此我只会使用最新技术。

此外，根据Stripe关于PCI合规性的页面：

如果您继续使用Stripe.js v2，则需要每年上传SAQ A-EP以证明您的业务符合PCI。

总体上使用Stripe的Elements系统是必经之路。 您无法触摸用户的付款信息，从而使其尽可能安全。 与AJAX调用相比，您弄乱代码的可能性要小得多。 如果您不小心将AJAX呼叫发送到您自己的服务器怎么办？ 您违反了PCI合规性。

Stripe Elements在样式方面还提供了许多自定义项。 您应该能够以与现有表单轻松集成的方式进行设计。

如何在不使用Stripe的UI层的情况下获取客户端令牌？

问题描述

2 个解决方案

解决方案1
2 已采纳 2019-02-10 07:27:33

解决方案2
1 2019-02-10 17:24:43

如何在不使用Stripe的UI层的情况下获取客户端令牌？

问题描述

2 个解决方案

解决方案1 2 已采纳 2019-02-10 07:27:33

解决方案2 1 2019-02-10 17:24:43

解决方案1
2 已采纳 2019-02-10 07:27:33

解决方案2
1 2019-02-10 17:24:43