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

# 3D Secure (3DS)

> Autentique o portador do cartão no banco emissor antes da cobrança e processe o pagamento.

## O que é 3DS?

3D Secure autentica o portador do cartão diretamente com o banco emissor, que pode exibir um desafio durante o checkout. Quando concluído, a responsabilidade por chargebacks de fraude passa para o banco, não para o vendedor.

<Frame caption="Exemplo de desafio 3DS exibido durante o checkout.">
  <img src="https://i.ibb.co/whDMKnSG/3ds-challenge.png" alt="Exemplo de desafio 3DS" />
</Frame>

Este guia mostra o fluxo de cartão completo: [tokenização](/sdk/tokenizacao), 3DS e [antifraude](/sdk/antifraude) juntos.

## Pré-requisitos

* SDK instalado e inicializado. Veja [Instalação](/sdk/visao-geral#instalação).
* Um backend próprio para fechar a cobrança na API da Cakto.

## Como processar um pagamento por cartão

Tudo dentro de um único handler de submit do formulário.

<Steps>
  <Step title="Tokenize o cartão">
    Gere o `cardToken` com `createToken`. Veja [Tokenização](/sdk/tokenizacao).
  </Step>

  <Step title="Autentique com 3DS">
    Valide `authResult.success` antes de cobrar.

    ```ts theme={null}
    const authResult = await caktoSdk.authenticate3DS({
      card,
      customer: {
        amount: 10000,
        currency: "BRL",
        email: "joao@exemplo.com",
        name: "João da Silva",
        phone: "11999999999",
        paymentMethod: "credit",
        address: {
          street: "Rua Exemplo",
          number: "123",
          complement: "Apto 1",
          city: "São Paulo",
          state: "SP",
          zipcode: "01234-567",
        },
      },
    });

    if (!authResult.success) {
      throw new Error(authResult.error || "Falha na autenticação 3DS");
    }
    ```
  </Step>

  <Step title="Finalize o antifraude">
    Chame antes de enviar ao backend. Veja [Antifraude](/sdk/antifraude).

    ```ts theme={null}
    await caktoSdk.completeAntifraudProfile();
    ```
  </Step>

  <Step title="Envie ao seu backend">
    Repasse token, dados do 3DS e a referência antifraude ao seu servidor.

    ```ts theme={null}
    await fetch("https://seu-backend.com/pagamentos", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({
        cardToken,
        threeDSecure: {
          cavv: authResult.cavv,
          eci: authResult.eci,
          xid: authResult.xid,
          referenceId: authResult.referenceId,
          version: authResult.version,
        },
        antifraud_profiling_attempt_reference: caktoSdk.getAntifraudReference(),
      }),
    });
    ```
  </Step>
</Steps>

## No seu backend

O backend não usa o SDK. Ele chama a API REST da Cakto direto: obtém um Bearer token e cria a cobrança com o que veio do front.

<Steps>
  <Step title="Obtenha o Bearer token">
    Com o par de chaves de API, no servidor.

    ```ts theme={null}
    const tokenRes = await fetch("https://api.cakto.com.br/public_api/token", {
      method: "POST",
      headers: { "Content-Type": "application/x-www-form-urlencoded" },
      body: new URLSearchParams({
        client_id: process.env.CAKTO_API_CLIENT_ID,
        client_secret: process.env.CAKTO_API_CLIENT_SECRET,
      }),
    });

    const { access_token } = await tokenRes.json();
    ```
  </Step>

  <Step title="Crie a cobrança">
    Use `paymentMethod: "threeDs"` e o `offerId` da oferta que está sendo vendida.

    ```ts theme={null}
    await fetch("https://api.cakto.com.br/public_api/payments", {
      method: "POST",
      headers: {
        Authorization: `Bearer ${access_token}`,
        "Content-Type": "application/json",
      },
      body: JSON.stringify({
        offerId,
        paymentMethod: "threeDs",
        customer,
        cardToken,
        threeDSecure,
        antifraud_profiling_attempt_reference,
      }),
    });
    ```
  </Step>
</Steps>

<Info>
  Veja todos os campos aceitos na cobrança em [Criar Cobrança
  3DS](/api-reference/payments/create-3ds).
</Info>

## Importante

* `authenticate3DS` roda só no browser. Não funciona em SSR nem Node.js.
* Sempre valide `authResult.success` antes de cobrar.
* Nunca envie o número do cartão ao backend. Use apenas o `cardToken`.