> ## Documentation Index
> Fetch the complete documentation index at: https://docs.paysight.io/llms.txt
> Use this file to discover all available pages before exploring further.

# 3DS via Card Submit API

> Implement 3D Secure (3DS) using the Paysight Card Submit API with a frictionless (non-widget) client flow.

# 3DS via Paysight Card Submit API

## Overview

This document explains how to implement 3D Secure (3DS) authentication using the Paysight Card Submit API, focusing on the frictionless (non-widget) flow. It clarifies that the `failOnChallenge` property is handled exclusively on the client side when launching the 3DS modal, not in the Card Submit API request or response.

## Prerequisites

You need to reach out to your account manager to get your unique client credentials for launching 3DS in the browser.

## Step-by-Step Integration

### 1. Initiate Card Submit API Call

* Use the [Card Submit API](https://docs.paysight.io/api-reference/card-submit/card/submit-card-and-customer-info-for-a-product#body-three-d-secure) endpoint.
* In your request body, include the `threeDSecure` object to indicate that 3DS should be used (e.g., `{ "enabled": true }`).

**Example Request:**

```json theme={null}
{
  "productId": "YOUR_PRODUCT_ID",
  "card": {
    "number": "4111111111111111",
    "month": "12",
    "year": "2027",
    "cvv": "123",
    "name": "John Doe"
  },
  "threeDSecure": {
    "enabled": true
  }
}
```

### 2. Handle API Response

* The response will include a `threeDSecureId` if 3DS is required.

### 3. Client-Side 3DS Authentication (UI)

* If `threeDSecureId` is present in the response, you must initiate the 3DS UI on the client side.
* To enforce frictionless-only flow, pass the `failOnChallenge: true` option when launching the 3DS UI with the Paysight JavaScript client library (your account manager will share the exact API for your integration):

```javascript theme={null}
// Illustrative — use the method documented for your Paysight client SDK
openThreeDSecure('tds_visa_123456789', { failOnChallenge: true });
```

* This ensures that if a challenge is required, the authentication will fail and the user will not be prompted with a challenge UI.
* For full SDK details, contact Paysight support or your account manager.

### 4. Complete the 3DS Flow

* After the user completes the 3DS authentication (success or failure), make a POST request to the endpoint:
  * `api/{product_id}/3ds`
* The payload must include either `paysightSession` or `partnerSession`, and the `threeDSecureId`.

**Example Request:**

```json theme={null}
{
  "paysightSession": "202411081009337750211111",
  "partnerSession": "7fdasfe3331f2bc22cdc221",
  "threeDSecureId": "tds_visa_eb09429d1b57"
}
```

* The response will be the standard card submit response, including transaction details if successful. Please see the [Paysight Card Submit API Documentation](https://docs.paysight.io/api-reference/card-submit/card/submit-card-and-customer-info-for-a-product#body-three-d-secure) for more info.

## Testing

* You can use any sandbox MID already set up for testing 3DS flows.
* Example sandbox credentials:
  * Team ID: team\_914161f65721
  * APP ID: app\_8cb3c2a389f4

## References

* [Paysight Card Submit API Documentation](https://docs.paysight.io/api-reference/card-submit/card/submit-card-and-customer-info-for-a-product#body-three-d-secure)

## Notes

* The Paysight widget is not required for this integration, but a client-side UI is necessary for 3DS authentication.
* For further questions or edge cases, refer to the linked documentation or contact the Paysight team.

## Visibility

For successful 3DS, you will see an icon in the Transactions view, which also displays the ECI (Electronic Commerce Indictor):

<img src="https://mintcdn.com/paysight/csx5Ubv1hP5_yyiU/images/image.png?fit=max&auto=format&n=csx5Ubv1hP5_yyiU&q=85&s=0b864e22940aaadc08258166821f37dd" alt="image.png" title="image.png" style={{ width:"100%" }} width="1032" height="131" data-path="images/image.png" />

\
\
You'll also ' 3DS' in the debug info at the bottom of the Transactions detail view, as per screenshot:

<img src="https://mintcdn.com/paysight/csx5Ubv1hP5_yyiU/images/image.png?fit=max&auto=format&n=csx5Ubv1hP5_yyiU&q=85&s=0b864e22940aaadc08258166821f37dd" alt="image.png" width="1032" height="131" data-path="images/image.png" />

We have some upcoming updates to provide better visibility on 3DS in Transactions and Reporting. We released this feature early so that clients could start using it immediately.
