如何添加自定义字段，以弹出Stripe Checkout的形式

How to add custom fields to popup form of Stripe Checkout

本文关键字：Stripe Checkout 何添加 添加 字段 自定义      更新时间：2023-09-26

我如何添加自定义字段到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 ($20.00)"
    data-amount="2000"
    data-billingAddress="true"
    data-shippingAddress="true">
  </script>
</form>

我发现Stripe Checkout只能包含以下自定义值:

stripeBillingName: 
stripeBillingAddressLine1: 
stripeBillingAddressApt:
stripeBillingAddressZip: 
stripeBillingAddressCity: 
stripeBillingAddressState: 
stripeBillingAddressCountry: 
stripeBillingAddressCountryCode:

有别的办法吗?请让我知道谢谢你

不幸的是，没有办法调整Stripe Checkout来添加自定义字段或复选框。这里的解决方案是使用Custom Checkout并将这些额外字段添加到您自己的表单中。例如，您可以收集客户的姓名，并要求他接受您自己的服务条款，并且只允许他们点击支付按钮，一旦他们这样做。

然后，一旦客户用他们的卡详细信息填写Checkout, Stripe将令牌发送给您，您将将其发送给您的服务器以及您在您端收集的额外详细信息。

Stripe现在建议使用Stripe .js方法，而不是弃用的checkout模式方法(不要与新的Stripe checkout混淆)。

为此，为了添加自定义字段(如名称，包类型，自定义标签等)，我发现的工作是通过添加: 来调整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);

因此，如果我有一个名为"customInput"的单选按钮组，它会将选中的任何单选按钮的值附加到"customInput"$_POST字段。这样，目标脚本就可以检索并使用它。

您可以尝试通过clientReferenceId ie添加自己的文件。=> extrauserid::option2::option2但不幸的是你没有得到这个在payment_intent。成功与丢失的sku相同。

clientReferenceId字符串

引用Checkout会话的唯一字符串。这可以是客户ID、购物车ID或类似的ID。它包含在checkout.session.completed webhook中，可用于完成购买。

var data = {
    customerEmail: eml,
    successUrl: 'https://...',
    cancelUrl: 'https://...',
    clientReferenceId: user + '::' + option1,
    items: [{  
       sku: sku, 
       quantity: 1
    }],
}
stripe.redirectToCheckout(data);

checkout.session.completed 

"cancel_url": "https://....",
"client_reference_id": "user123::somevalue",
"customer": "cus_H1vFYbxY2XMAz6",
相关文章：