Save payment details during payment

Learn how to accept a payment and save your customer's payment details for future purchases.

Note

Support for saved payment methods using Elements and the Checkout Sessions API only includes cards. It doesn’t support other saved payment methods, such as bank accounts.

Enable saved payment methods

Caution

Global privacy laws are complicated and nuanced. Before implementing the ability to store customer payment method details, work with your legal team to make sure that it complies with your privacy and compliance framework.

To allow a customer to save their payment method for future use, specify the saved_payment_method_options.payment_method_save parameter when creating the Checkout Session.

Saving a payment method requires a Customer. Pass an existing customer, or, to create a new customer, set the Checkout Session’s customer_creation to always.

After you create the Checkout Session, use the client secret returned in the response to build your checkout page.

Pass in additional elementsOptions on initCheckout to enable the Payment Element to display a consent collection checkbox for you.

checkout.js
const checkout = await stripe.initCheckout({
  fetchClientSecret,
  elementsOptions: {
    savedPaymentMethod: {
      enableSave: 'auto',
    }
  }
});

Reuse a previously saved payment method

Each saved payment method is linked to a Customer object. Before creating the Checkout Session, authenticate your customer, and pass the corresponding Customer ID to the Checkout Session.

The Payment Element automatically redisplays previously saved payment methods for your customer to use during checkout.

Pass in additional elementsOptions on initCheckout to enable the Payment Element to redisplay previously saved payment methods for your customer to use during checkout.

checkout.js
const checkout = await stripe.initCheckout({
  fetchClientSecret,
  elementsOptions: {
    savedPaymentMethod: {
      enableSave: 'auto',
      enableRedisplay: 'auto',
    }
  }
});