Web SDK верификации личности: JavaScript и iframe

Эти руководства описывают верификацию личности. Для входа конечных пользователей используйте руководства по платформе аутентификации; новые пакеты аутентификации зависят от релиза.

Интегрируйте верификацию Didit в свое веб-приложение. Мы предлагаем семь методов интеграции, которые подойдут вашей архитектуре и требованиям к пользовательскому опыту. Выберите тот, который соответствует вашему стеку.

Выберите метод интеграции: от быстрых iframe без кода до полного программного контроля с помощью нашего JavaScript SDK, а также готовых плагинов для WordPress, Shopify и Salesforce.

Методы интеграции

Метод	Время настройки	Бэкенд?	Лучше всего подходит для
JavaScript SDK	3 минуты	Опционально	Полный контроль — React/Vue/Angular/Next.js/Nuxt/Svelte/обычный JS
InContext (Iframe)	менее 1 минуты	Опционально	Встроенный сценарий без перенаправления
Redirect	5 минут	Да	Максимальная совместимость, сценарии с переключением между устройствами
WebView (iOS/Android)	15 минут	Да	Запасной вариант для мобильных приложений, когда нативный SDK недоступен
WordPress + WooCommerce	5 минут	Без кода	Сайты на WordPress, магазины WooCommerce
Shopify	5 минут	Без кода	Магазины Shopify: проверка при оформлении заказа или аккаунта
Salesforce	10 минут	Без кода	CRM Salesforce: верификация записей Contact и Lead

Рекомендация: для продакшн-веб-приложений используйте JavaScript SDK для лучшего UX и полного программного контроля. Используйте InContext iframe для самой быстрой настройки, Redirect, когда нужна верификация с переключением между устройствами, а также специализированные интеграции WordPress / Shopify / Salesforce, если вы работаете на этих платформах.

JavaScript SDK

JavaScript SDK Didit предоставляет программный способ интеграции верификации с полным контролем над пользовательским опытом. Ключевые возможности:

Управление сессиями и обратные вызовы событий
Поддержка React, Vue, Angular, NextJS, Nuxt, Svelte и обычный JS
Полная поддержка TypeScript
Режимы модального окна и встраивания

Быстрый старт:

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'
});

→ Полная документация по JavaScript SDK

InContext (Iframe)

Встраивайте процесс верификации непосредственно в ваше приложение с помощью iframe. Бесшовный процесс без перенаправления пользователей с вашего сайта. Ключевые возможности:

UniLink (без бэкенда): настройка менее 1 минуты
API-сессия (с бэкендом): полная кастомизация
Режимы модального окна и встраивания
Примеры компонентов React

Быстрый старт:

<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>

→ Полная документация по InContext

Redirect

Перенаправьте пользователей на размещённую на стороне Didit страницу верификации. После завершения пользователи возвращаются на ваш URL обратного вызова. Ключевые возможности:

Максимальная совместимость с браузерами
Поддержка верификации с переключением между устройствами
Простая интеграция
Работает, когда доступ камеры в iframe вызывает проблемы

Быстрый старт:

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

→ Полная документация по Redirect

Сравнение

Характеристика	JavaScript SDK	InContext (Iframe)	Redirect
Время настройки	3 мин	< 1 мин	5 мин
Требуется бэкенд	Опционально	Опционально	Да
Остаётся на вашем домене	Да	Да	Нет
Поддержка переключения между устройствами	Да	Да	Да
Полный программный контроль	Да	Ограниченный	Только обратный вызов
Обратные вызовы событий	В реальном времени	`postMessage`	Только обратный вызов
White label	Да	Да	Да
Совместимость с браузерами	Все	Все	Все

Все три метода передают окончательные подписанные результаты через webhook. Сравнение выше описывает UX в браузере, а не то, как вы получаете решение о верификации.

Конфигурация

Обязательные разрешения для iframe

Для интеграций InContext iframe всегда включайте следующие разрешения:

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

Примеры репозиториев

Примеры SDK для веба

Примеры для React, Vue, Angular, Next.js, Nuxt, Svelte и обычный JS

Пример iframe

Примеры iframe для UniLink и API-сессии

Полное демо на Next.js

Сквозная интеграция с Next.js

NPM-пакет

@didit-protocol/sdk-web в npm

Связанные материалы

Webhook — получение подписанных результатов верификации на вашем бэкенде
API создания сессии — эндпоинт, лежащий в основе каждого веб-SDK
Нативные SDK — iOS, Android, React Native, Flutter

Руководства

Аутентификация

Model Context Protocol (MCP)

Веб-SDK

Нативные SDK

Серверные SDK

Интеграции

Web SDK верификации личности: JavaScript и iframe

Методы интеграции

JavaScript SDK

InContext (Iframe)

Redirect

Сравнение

Конфигурация

Обязательные разрешения для iframe

Примеры репозиториев

Примеры SDK для веба

Пример iframe

Полное демо на Next.js

NPM-пакет

Связанные материалы

​Методы интеграции

​JavaScript SDK

​InContext (Iframe)

​Redirect

​Сравнение

​Конфигурация

​Обязательные разрешения для iframe

​Примеры репозиториев

Примеры SDK для веба

Пример iframe

Полное демо на Next.js

NPM-пакет

​Связанные материалы

Методы интеграции

JavaScript SDK

InContext (Iframe)

Redirect

Сравнение

Конфигурация

Обязательные разрешения для iframe

Примеры репозиториев

Связанные материалы