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

# SDK de verificació d'identitat web: JavaScript i iframe

> Didit: SDK web de KYC, KYB i AML amb JavaScript, iframe o redirecció. Des de $0.33 per KYC complet, $10 gratuïts al mes, sense contractes.

> [!NOTE]
>
> Aquestes guies cobreixen la verificació d'identitat. Per a l'inici de sessió d'usuaris finals, utilitza les [guies de la plataforma d'autenticació](https://docs.didit.me/ca/authentication/overview.md); els nous paquets d'autenticació depenen del llançament.

Integra la verificació de Didit a la teva aplicació web. Oferim set mètodes d'integració perquè s'adaptin a la teva arquitectura i als requisits de l'experiència d'usuari: tria el que coincideixi amb la teva pila tecnològica.

> [!NOTE]
>
> **Tria el teu mètode d'integració**: des d'iframes sense codi per començar ràpidament fins al control programàtic complet amb el nostre SDK de JavaScript, o complements llestos per utilitzar per a WordPress, Shopify i Salesforce.

***

## Mètodes d'integració

| Mètode | Temps de configuració | Backend? | Més adequat per |
| - | - | - | - |
| [JavaScript SDK](https://docs.didit.me/ca/integration/web-sdks/javascript-sdk.md) | 3 minuts | Opcional | Control complet — React/Vue/Angular/Next.js/Nuxt/Svelte/vanilla |
| [InContext (Iframe)](https://docs.didit.me/ca/integration/web-sdks/incontext-iframe.md) | \< 1 minut | Opcional | Experiència integrada sense redirecció |
| [Redirect](https://docs.didit.me/ca/integration/web-sdks/web-redirect.md) | 5 minuts | Sí | Màxima compatibilitat, fluxos entre dispositius |
| [WebView (iOS/Android)](https://docs.didit.me/ca/integration/web-sdks/webview-in-ios-android.md) | 15 minuts | Sí | Alternativa mòbil quan no hi ha cap SDK natiu disponible |
| [WordPress + WooCommerce](https://docs.didit.me/ca/integration/web-sdks/wordpress-woocommerce.md) | 5 minuts | Sense codi | Llocs WordPress, botigues WooCommerce |
| [Shopify](https://docs.didit.me/ca/integration/web-sdks/shopify.md) | 5 minuts | Sense codi | Botigues Shopify — procés de pagament o verificació del compte |
| [Salesforce](https://docs.didit.me/ca/integration/web-sdks/salesforce.md) | 10 minuts | Sense codi | CRM Salesforce — verificació dels registres de contactes o clients potencials |

> [!NOTE]
>
> **Recomanació**: per a aplicacions web en producció, utilitza el **JavaScript SDK** per obtenir la millor UX i el control programàtic complet. Utilitza l'**iframe InContext** per a la configuració més ràpida, la **Redirecció** quan calgui una verificació entre dispositius, i les integracions específiques de **WordPress / Shopify / Salesforce** si treballes amb aquestes plataformes.

***

## JavaScript SDK

L'SDK de JavaScript de Didit ofereix una manera programàtica d'integrar la verificació amb control total sobre l'experiència de l'usuari.

**Característiques principals:**

* Gestió de sessions i callbacks d'esdeveniments
* Compatibilitat amb React, Vue, Angular, NextJS, Nuxt, Svelte i JavaScript pur
* Suport complet de TypeScript
* Modes modals i en línia

**Inici ràpid:**

```javascript theme={null}
import { DiditSdk } from '@didit-protocol/sdk-web';

DiditSdk.shared.onComplete = (result) => {
  switch (result.type) {
    case 'completed':
      console.log('Verification completed!');
      console.log('Session ID:', result.session?.sessionId);
      console.log('Status:', result.session?.status);
      break;
    case 'cancelled':
      console.log('User cancelled verification');
      break;
    case 'failed':
      console.error('Verification failed:', result.error?.message);
      break;
  }
};

// Start verification with the `url` returned by POST /v3/session/ (or your UniLink)
DiditSdk.shared.startVerification({
  url: 'https://verify.didit.me/session/3FaJ9wLqX2Mz'
});
```

→ [**Documentació completa del JavaScript SDK**](https://docs.didit.me/ca/integration/web-sdks/javascript-sdk.md)

***

## InContext (Iframe)

Incrusta el flux de verificació directament dins de la teva aplicació mitjançant un iframe. Experiència fluida sense redirigir els usuaris fora del teu lloc.

**Característiques principals:**

* UniLink (no requereix backend): configuració en \< 1 minut
* Sessió d'API (amb backend): personalització completa
* Implementacions modals i en línia
* Exemples de components de React

**Inici ràpid:**

```html theme={null}
<iframe 
  src="https://verify.didit.me/u/YOUR_WORKFLOW_ID_BASE64"
  style="width: 100%; height: 700px; border: none;" 
  allow="camera; microphone; geolocation; clipboard-write; fullscreen; autoplay; encrypted-media; digital-credentials-get"
></iframe>
```

→ [**Documentació completa d'InContext**](https://docs.didit.me/ca/integration/web-sdks/incontext-iframe.md)

***

## Redirect

Redirigeix els usuaris a la pàgina de verificació allotjada per Didit. En acabar, els usuaris tornen a la teva URL de callback.

**Característiques principals:**

* Compatibilitat màxima amb els navegadors
* Suport de verificació entre dispositius
* Integració senzilla
* Funciona quan l'accés de la càmera de l'iframe dóna problemes

**Inici ràpid:**

```javascript theme={null}
// After creating a session via your backend
window.location.href = verificationUrl;
```

→ [**Documentació completa de la Redirecció**](https://docs.didit.me/ca/integration/web-sdks/web-redirect.md)

***

## Comparació

| Funcionalitat | JavaScript SDK | InContext (Iframe) | Redirect |
| - | - | - | - |
| Temps de configuració | 3 min | \< 1 min | 5 min |
| Backend necessari | Opcional | Opcional | Sí |
| Es manté al teu domini | Sí | Sí | No |
| Compatibilitat entre dispositius | Sí | Sí | Sí |
| Control programàtic complet | Sí | Limitat | Només callback |
| Callbacks d'esdeveniments | En temps real | `postMessage` | Només callback |
| Marca blanca | Sí | Sí | Sí |
| Compatibilitat amb navegadors | Tots | Tots | Tots |

> [!NOTE]
>
> Els tres mètodes proporcionen resultats finals i signats mitjançant [webhooks](https://docs.didit.me/ca/integration/webhooks.md). La comparació anterior descriu l'experiència al navegador, no com reps la decisió de verificació.

***

## Configuració

### Permisos obligatoris de l'iframe

Per a les integracions amb iframe InContext, inclou sempre aquests permisos:

```html theme={null}
allow="camera; microphone; geolocation; clipboard-write; fullscreen; autoplay; encrypted-media; digital-credentials-get"
```

***

## Repositoris d'exemple

> [card] [Exemples d'SDK web](https://github.com/didit-protocol/sdk-web-examples)
>
> Exemples de React, Vue, Angular, Next.js, Nuxt, Svelte i JavaScript pur

> [card] [Exemple d'iframe](https://github.com/didit-protocol/iframe-example)
>
> Exemples d'iframe amb UniLink i amb sessió d'API

> [card] [Demo completa de Next.js](https://github.com/didit-protocol/didit-full-demo)
>
> Integració completa de Next.js de principi a fi

> [card] [Paquet NPM](https://www.npmjs.com/package/@didit-protocol/sdk-web)
>
> `@didit-protocol/sdk-web` a npm

## Relacionat

* [Webhooks](https://docs.didit.me/ca/integration/webhooks.md): rep resultats de verificació signats al teu backend
* [API de creació de sessions](https://docs.didit.me/ca/sessions-api/create-session.md): l'endpoint en què es basa cada SDK web
* [SDKs natius](https://docs.didit.me/ca/integration/native-sdks/overview.md): iOS, Android, React Native, Flutter


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.