javascript 如何将自定义字段添加到 Stripe Checkout 的弹出表单
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/30592382/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to add custom fields to popup form of Stripe Checkout
提问by Ahmad
How can i add custom fields to Stripe Checkout form such as First Name, Last Name and maybe even a checkbox with a custom button? So far i've come up with this;
我如何向 Stripe Checkout 表单添加自定义字段，例如名字、姓氏，甚至可能是带有自定义按钮的复选框？到目前为止，我已经想出了这个；
<script src="https://checkout.stripe.com/checkout.js"></script>
<form action="/charge" method="POST">
<script
src="https://checkout.stripe.com/checkout.js" class="stripe-button"
data-key="pk_test_i2txBI2jUjSQIMoqFz3Fo326"
data-image="https://stripe.com/img/documentation/checkout/marketplace.png"
data-name="Matt's Widgets and Gizmos"
data-description="2 widgets (.00)"
data-amount="2000"
data-billingAddress="true"
data-shippingAddress="true">
</script>
</form>
And i found that Stripe Checkout can only include the following custom values which are as under;
我发现 Stripe Checkout 只能包含以下自定义值；
stripeBillingName:
stripeBillingAddressLine1:
stripeBillingAddressApt:
stripeBillingAddressZip:
stripeBillingAddressCity:
stripeBillingAddressState:
stripeBillingAddressCountry:
stripeBillingAddressCountryCode:
Is there any way around this? Please let me know Thank you
有没有办法解决？请告诉我谢谢
采纳答案by koopajah
There is no way to tweak Stripe Checkout unfortunately to add a custom field or a checkbox. The solution here is to use Custom Checkoutand add those extra fields to your own form. You would for example collect the customer's name and ask him to accept your own Terms of Service and only allow them to click on the Pay button once they do.
不幸的是，无法调整 Stripe Checkout 以添加自定义字段或复选框。此处的解决方案是使用自定义结帐并将这些额外字段添加到您自己的表单中。例如，您可以收集客户的姓名并要求他接受您自己的服务条款，并且只允许他们在完成后点击“支付”按钮。
Then, once the customer fills Checkout with their card details and Stripe sends you back the token you would send it to your server along with the extra details you collected on your end.
然后，一旦客户使用他们的卡详细信息填写 Checkout 并且 Stripe 将令牌发回给您，您就会将其与您收集的额外详细信息一起发送到您的服务器。
回答by Chris Simmons
Stripe now recommends using the stripe.jsmethod versus the deprecated checkout modal method (not to be confused with the new Stripe Checkout).
Stripe 现在推荐使用stripe.js方法而不是弃用的 checkout modal 方法（不要与新的Stripe Checkout混淆）。
To that end, in order to add custom fields (such as name, package type, custom tags, etc), what I found works is tweaking the stripe.js function stripeTokenHandler() by adding:
为此，为了添加自定义字段（例如名称、包类型、自定义标签等），我发现有效的是通过添加以下内容来调整 stripe.js 函数 stripeTokenHandler()：
var customInput = document.createElement('input');
customInput.setAttribute('type', 'hidden');
customInput.setAttribute('name', 'customInput');
customInput.setAttribute('value', $("input[name=customInput]:checked").val());
form.appendChild(customInput);
So if I had a radio button group called "customInput", it would attach the value of whatever radio button was selected to the "customInput" $_POST field. This way the target script can retrieve it and use it.
因此，如果我有一个名为“customInput”的单选按钮组，它会将选择的任何单选按钮的值附加到“customInput”$_POST 字段。这样目标脚本就可以检索并使用它。
Hope this helps someone.
希望这可以帮助某人。
回答by user956584
You can try add own filed by pass as clientReferenceIdie. => extrauserid::option2::option2but unfortunately you don't get this in in payment_intent.succeededsame as missing SKUs.
您可以尝试将自己提交的文件添加为clientReferenceId，即。=> extrauserid::option2::option2但不幸的是你没有在payment_intent.succeeded 中得到这个，就像缺少 SKU 一样。
A unique string to reference the Checkout session. This can be a customer ID, a cart ID, or similar. It is included in the checkout.session.completed webhook and can be used to fulfill the purchase.
引用 Checkout 会话的唯一字符串。这可以是客户 ID、购物车 ID 或类似内容。它包含在 checkout.session.completed 网络钩子中，可用于完成购买。
var data = {
customerEmail: eml,
successUrl: 'https://...',
cancelUrl: 'https://...',
clientReferenceId: user + '::' + option1,
items: [{
sku: sku,
quantity: 1
}],
}
stripe.redirectToCheckout(data);
checkout.session.completed
checkout.session.completed
"cancel_url": "https://....",
"client_reference_id": "user123::somevalue",
"customer": "cus_H1vFYbxY2XMAz6",
