Stripe collect customer billing address and calculate tax dynamically

Question

so far I managed to create the form that collects customer credit card information, however, I am trying to find how to add the form that also collects customer address for verification and tax calculation, so far I have not been able how to add the address and postal code like the image below:

Is this form something that Stripe has built in or the address form are separate from Stripe API?

So far I have checked these links and had no successes:

1. https://stripe.com/docs/api/cards/object#card_object-address_line1
2. https://stripe.com/docs/payments/accept-a-payment#web
3. https://checkout.stripe.dev/preview
4. https://stripe.com/docs/payments/checkout/taxes

Answer 1

Stripe does not provide address or postal code fields. Instead you would add normal HTML form fields on your page with the values being passed in when you call Stripe.js methods like stripe.confirmCardPayment.

For example, you can pass in name, email, country, and postal code like this:

stripe.confirmCardPayment(clientSecret, {
    payment_method: {
        type: 'card',
        card: cardElement,
        billing_details: {
            name: 'Jane Doe',
            email: '[email protected]',
            address: {
                country: 'US',
                postal_code: '98765',
            },
        },
    },
});

Instead of those hardcoded values you can pull the information from the various <input> elements on your page.

See Stripe's documentation for stripe.confirmCardPayment for more details, and Stripe's documentation on Payment Method billing_details for all of the properties you can define here.