Didit 网页身份验证 SDK：JavaScript 与 iframe 集成

Estas guías cubren la verificación de identidad. Para el inicio de sesión de usuarios finales, usa las guías de la plataforma de autenticación; los nuevos paquetes de autenticación dependen de la versión de lanzamiento.

Integra la verificación de Didit en tu aplicación web. Ofrecemos siete métodos de integración para adaptarnos a tu arquitectura y a los requisitos de experiencia de usuario: elige el que coincida con tu stack.

Elige tu método de integración: desde iframes rápidos y sin código hasta control programático completo con nuestro SDK de JavaScript, o plugins listos para usar en WordPress, Shopify y Salesforce.

Métodos de integración

Método	Tiempo de configuración	Backend	Ideal para
SDK de JavaScript	3 minutos	Opcional	Control total: React/Vue/Angular/Next.js/Nuxt/Svelte/JS puro
InContext (iframe)	< 1 minuto	Opcional	Experiencia integrada sin redirección
Redirección	5 minutos	Sí	Máxima compatibilidad, flujos entre dispositivos
WebView (iOS/Android)	15 minutos	Sí	Alternativa móvil cuando no hay SDK nativo disponible
WordPress + WooCommerce	5 minutos	Sin código	Sitios de WordPress, tiendas de WooCommerce
Shopify	5 minutos	Sin código	Tiendas de Shopify: verificación durante el pago o verificación de la cuenta
Salesforce	10 minutos	Sin código	CRM de Salesforce: verificación de registros de contacto o cliente potencial

Recomendación: para aplicaciones web en producción, usa el SDK de JavaScript para la mejor experiencia de usuario y el control programático completo. Usa el iframe InContext para la configuración más rápida, Redirección cuando se necesite verificación entre dispositivos, y las integraciones específicas de WordPress / Shopify / Salesforce si trabajas en esas plataformas.

SDK de JavaScript

El SDK de JavaScript de Didit ofrece una forma programática de integrar la verificación, con control total sobre la experiencia de usuario. Características principales:

Gestión de sesiones y callbacks de eventos
Compatibilidad con React, Vue, Angular, NextJS, Nuxt, Svelte y JavaScript puro
Soporte completo de TypeScript
Modos modal y en línea

Inicio rápido:

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ón completa del SDK de JavaScript

InContext (iframe)

Integra el flujo de verificación directamente en tu aplicación mediante un iframe. Experiencia fluida, sin redirigir a los usuarios fuera de tu sitio. Características principales:

UniLink (sin backend necesario): configuración en < 1 minuto
Sesión de API (con backend): personalización completa
Implementaciones modal y en línea
Ejemplos de componentes para React

Inicio rápido:

<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ón completa de InContext

Redirección

Redirige a los usuarios a la página de verificación alojada por Didit. Al terminar, los usuarios regresan a tu URL de callback. Características principales:

Máxima compatibilidad con navegadores
Soporte de verificación entre dispositivos
Integración sencilla
Funciona cuando el acceso a la cámara en el iframe presenta problemas

Inicio rápido:

// After creating a session via your backend
window.location.href = verificationUrl;

→ Documentación completa de Redirección

Comparación

Característica	SDK de JavaScript	InContext (iframe)	Redirección
Tiempo de configuración	3 min	< 1 min	5 min
Backend requerido	Opcional	Opcional	Sí
Permanece en tu dominio	Sí	Sí	No
Soporte entre dispositivos	Sí	Sí	Sí
Control programático completo	Sí	Limitado	Solo callback
Callbacks de eventos	En tiempo real	`postMessage`	Solo callback
Marca blanca	Sí	Sí	Sí
Compatibilidad con navegadores	Todos	Todos	Todos

Los tres métodos entregan resultados finales firmados mediante webhooks. La comparación anterior describe la experiencia de uso en el navegador, no cómo recibes la decisión de verificación.

Configuración

Permisos necesarios del iframe

En las integraciones con iframe InContext, incluye siempre estos permisos:

allow="camera; microphone; geolocation; clipboard-write; fullscreen; autoplay; encrypted-media; digital-credentials-get"

Repositorios de ejemplo

Ejemplos web del SDK

Ejemplos en React, Vue, Angular, Next.js, Nuxt, Svelte y JavaScript puro

Ejemplo de iframe

Ejemplos de iframe con UniLink y con sesión de API

Demo completa de Next.js

Integración de extremo a extremo con Next.js

Paquete NPM

@didit-protocol/sdk-web en npm

Relacionado

Webhooks: recibe en tu backend los resultados de verificación firmados
API de creación de sesiones: el endpoint en el que se basa cada SDK web
SDK nativos: iOS, Android, React Native, Flutter

指南

身份认证

模型上下文协议（MCP）

Web SDK

原生 SDK

服务端 SDK

集成

Didit 网页身份验证 SDK：JavaScript 与 iframe 集成

Métodos de integración

SDK de JavaScript

InContext (iframe)

Redirección

Comparación

Configuración

Permisos necesarios del iframe

Repositorios de ejemplo

Ejemplos web del SDK

Ejemplo de iframe

Demo completa de Next.js

Paquete NPM

Relacionado

​Métodos de integración

​SDK de JavaScript

​InContext (iframe)

​Redirección

​Comparación

​Configuración

​Permisos necesarios del iframe

​Repositorios de ejemplo

Ejemplos web del SDK

Ejemplo de iframe

Demo completa de Next.js

Paquete NPM

​Relacionado

Métodos de integración

SDK de JavaScript

InContext (iframe)

Redirección

Comparación

Configuración

Permisos necesarios del iframe

Repositorios de ejemplo

Relacionado