## Confirm a card payment

Use `stripe.confirmCardPayment` when the customer submits your payment form.
When called, it will confirm the [PaymentIntent](/api/payment_intents.md) with `data` you provide and carry out 3DS or other next actions if they are required.

If you are using [Dynamic 3D Secure](/payments/3d-secure.md#three-ds-radar), `stripe.confirmCardPayment` will trigger your Radar rules to execute and may open a dialog for your customer to authenticate their payment.

When you confirm a `PaymentIntent`, it needs to have an attached [PaymentMethod](/api/payment_methods.md).
In addition to confirming the `PaymentIntent`, this method can automatically create and attach a new `PaymentMethod` for you.
It can also be called with an existing `PaymentMethod`, or if you have already attached a `PaymentMethod` you can call this method without needing to provide any additional data.
These use cases are detailed in the sections that follow.

> Note that `stripe.confirmCardPayment` may take several seconds to complete.
> During that time, you should disable your form from being resubmitted and show a waiting indicator like a spinner.
> If you receive an error result, you should be sure to show that error to the customer, re-enable the form, and hide the waiting indicator.
> 
> Additionally, `stripe.confirmCardPayment` may trigger a [3D Secure](/payments/3d-secure.md) authentication challenge.
> This will be shown in a modal dialog and may be confusing for customers using assistive technologies like screen readers.
> You should make your form accessible by ensuring that success or error messages are clearly read out after this method completes.

`stripe.confirmCardPayment` will return a `Promise` which resolves with a `result` object.
This object has either:

* `result.paymentIntent`: the successful [PaymentIntent](/api/payment_intents).
* `result.error`: an error. When the [error type](/api/errors#errors-type) is `card_error` or `validation_error`, you can display the error
message in `error.message` directly to your user. Refer to the [API reference](/api#errors) for other possible errors.

**Syntax:** `stripe.confirmCardPayment(...)`

- `clientSecret` (string) **required**
  The [client secret](/api/payment_intents/object.md#payment_intent_object-client_secret) of the `PaymentIntent`.

- `data` (object)
  Data to be sent with the request.
Refer to the [Payment Intents API](/api/payment_intents/confirm.md) for a full list of parameters.

  - `payment_method` (string | object)
    Either the `id` of an existing [PaymentMethod](/api/payment_methods.md), or an object containing data to create a `PaymentMethod` with.
See the use case sections below for details.

  - `shipping` (object)
    The [shipping details](/api/payment_intents/confirm.md#confirm_payment_intent-shipping) for the payment, if collected.

  - `return_url` (string)
    If you are [handling next actions yourself](/payments/payment-intents/verifying-status.md#next-actions), pass in a `return_url`.
If the subsequent action is `redirect_to_url`, this URL will be used on the return path for the redirect.

  - `receipt_email` (string)
    Email address that the receipt for the resulting payment will be sent to.

  - `setup_future_usage` (string)
    Indicates that you intend to make future payments with this PaymentIntent's payment method.

If present, the payment method used with this PaymentIntent can be [attached to a Customer](/api/payment_methods/attach.md), even after the transaction completes.

Use `on_session` if you intend to only reuse the payment method when your customer is present in your checkout flow.
Use `off_session` if your customer may or may not be in your checkout flow.
See [saving card details during payment](/payments/save-during-payment.md) to learn more.

Stripe uses `setup_future_usage` to dynamically optimize your payment flow and comply with regional legislation and network rules.
For example, if your customer is impacted by [SCA](/strong-customer-authentication.md), using `off_session` will ensure that they are authenticated while processing this PaymentIntent.
You will then be able to collect [off-session payments](/payments/cards/charging-saved-cards.md#off-session-payments-with-saved-cards) for this customer.

  - `payment_method_options` (object)
    An object containing payment-method-specific configuration to confirm the [PaymentIntent](/api/payment_intents.md) with.

    - `card` (object)
      Configuration for this card payment.

      - `cvc` (Element)
        Use the provided `cardCvc` [Element](/js/element.md) when confirming the PaymentIntent with an existing PaymentMethod.

      - `network` (string)
        Selected network to process this PaymentIntent on. Depends on the [available networks](/card-brand-choice.md#identifying-the-available-card-networks) of the card attached to the PaymentIntent. Can only be set at confirm-time.

- `options` (object)
  An options object to control the behavior of this method.

  - `handleActions` (boolean)
    Set this to `false` if you want to [handle next actions yourself](/payments/payment-intents/verifying-status.md#next-actions), or if you want to defer next action handling until later (e.g. for use in the [PaymentRequest API](/stripe-js/elements/payment-request-button.md#complete-payment-intents)).
Default is `true`.

### Use case: with payment data from an Element

Use `stripe.confirmCardPayment` with payment data from an [Element](/js/element.md)
by passing a `card` or `cardNumber` Element as `payment_method[card]` in the
data argument.

The new `PaymentMethod` will be created with data collected by the `Element`
and will be used to confirm the `PaymentIntent`.

### Data argument properties

- `payment_method` (object) **required**
  Pass an object to confirm using data collected by a `card` or `cardNumber` [Element](/js/element.md).

  - `card` (Element) **required**
    Uses the provided `card` or `cardNumber` [Element](/js/element.md) for confirmation.

  - `billing_details` (object)
    The [billing_details](/api/payment_methods/create.md#create_payment_method-billing_details) associated with the card.

### Confirm with an Element

```js
stripe
  .confirmCardPayment('{PAYMENT_INTENT_CLIENT_SECRET}', {
    payment_method: {
      card: cardElement,
      billing_details: {
        name: 'Jenny Rosen',
      },
    },
  })
  .then(function(result) {
    // Handle result.error or result.paymentIntent
  });
```

```es_next
const {paymentIntent, error} = await stripe.confirmCardPayment(
  '{PAYMENT_INTENT_CLIENT_SECRET}',
  {
    payment_method: {
      card: cardElement,
      billing_details: {
        name: 'Jenny Rosen',
      },
    },
  },
);
```

### Use case: with an existing payment method

Use `stripe.confirmCardPayment` with an existing `PaymentMethod` by passing its `id` to `payment_method`.
The `PaymentMethod` will be used to confirm the `PaymentIntent`.

### Data argument properties

- `payment_method` (string) **required**
  The `id` of an existing [PaymentMethod](/api/payment_methods.md).

### Confirm with existing payment method

```js
stripe
  .confirmCardPayment('{PAYMENT_INTENT_CLIENT_SECRET}', {
    payment_method: '{PAYMENT_METHOD_ID}',
  })
  .then(function(result) {
    // Handle result.error or result.paymentIntent
  });
```

```es_next
const {paymentIntent, error} = await stripe.confirmCardPayment(
  '{PAYMENT_INTENT_CLIENT_SECRET}',
  {
    payment_method: '{PAYMENT_METHOD_ID}',
  },
);
```

### Use case: with an existing token

For backwards compatibility, you can convert an existing `Token` into a `PaymentMethod` with `stripe.confirmCardPayment` by passing the `Token` to `payment_method[card][token]`.
The newly created `PaymentMethod` will be used to confirm the `PaymentIntent`.

### Data argument properties

- `payment_method` (object) **required**
  Pass an object to confirm using an existing token.

  - `card` (object) **required**
    An object of card data.

    - `token` (string) **required**
      Converts the provided token into a `PaymentMethod` to use for confirmation.

  - `billing_details` (object)
    The [billing_details](/api/payment_methods/create.md#create_payment_method-billing_details) associated with the card.

### Confirm with existing token

```js
stripe
  .confirmCardPayment('{PAYMENT_INTENT_CLIENT_SECRET}', {
    payment_method: {
      card: {
        token: 'tok_visa',
      },
    },
  })
  .then(function(result) {
    // Handle result.error or result.paymentIntent
  });
```

```es_next
const {paymentIntent, error} = await stripe.confirmCardSetup(
  '{PAYMENT_INTENT_CLIENT_SECRET}',
  {
    payment_method: {
      card: {
        token: 'tok_visa',
      },
    },
  },
);
```

### Use case: with an attached PaymentMethod

If you have already attached a `PaymentMethod` to this `PaymentIntent`, then you can confirm the `PaymentIntent` using `stripe.confirmCardPayment` without passing in any additional data.

### Confirm with an attached PaymentMethod

```js
stripe
  .confirmCardPayment('{PAYMENT_INTENT_CLIENT_SECRET}')
  .then(function(result) {
    // Handle result.error or result.paymentIntent
  });
```

```es_next
const {paymentIntent, error} = await stripe.confirmCardPayment(
  '{PAYMENT_INTENT_CLIENT_SECRET}',
);
```

### Confirm a card payment

```js
stripe
  .confirmCardPayment('{PAYMENT_INTENT_CLIENT_SECRET}', {
    payment_method: {
      card: cardElement,
      billing_details: {
        name: 'Jenny Rosen',
      },
    },
  })
  .then(function(result) {
    // Handle result.error or result.paymentIntent
  });
```

```es_next
const {paymentIntent, error} = await stripe.confirmCardPayment(
  '{PAYMENT_INTENT_CLIENT_SECRET}',
  {
    payment_method: {
      card: cardElement,
      billing_details: {
        name: 'Jenny Rosen',
      },
    },
  },
);
```