Динамический брендинг и UX: Настройка iFrame Didit с помощью JavaScript (RU)
Узнайте, как использовать JavaScript для динамической настройки встроенного iFrame верификации Didit для создания бесшовного пользовательского опыта с сохранением фирменного стиля.

Бесшовная интеграцияИнтегрируйте надежную верификацию личности Didit непосредственно в ваше веб-приложение с помощью метода iFrame InContext, предлагающего быструю настройку и встроенный опыт.
Динамическая настройкаИспользуйте API
postMessageJavaScript для связи и динамического стилизования встроенного iFrame, обеспечивая постоянное соответствие внешнего вида и ощущения вашего бренда на протяжении всего процесса верификации.Улучшенный пользовательский опытОбрабатывайте события в реальном времени из iFrame, такие как завершение или отмена верификации, чтобы обеспечить немедленную обратную связь и провести пользователей по плавному, фирменному пути.
Гибкая архитектура DiditМодульный и ориентированный на разработчиков подход Didit, включая iFrame InContext и JavaScript SDK, позволяет разработчикам создавать высоконастраиваемые и эффективные рабочие процессы верификации личности с бесплатным базовым KYC.
Интеграция iFrame InContext Didit для верификации личности
В современном цифровом мире надежная верификация личности имеет первостепенное значение для безопасности, соответствия требованиям и предотвращения мошенничества. Didit предлагает ряд методов интеграции, и для компаний, которым нужна быстрая настройка со встроенным опытом, выделяется iFrame InContext. Этот метод позволяет встраивать мощные возможности верификации личности Didit непосредственно в ваше веб-приложение, удерживая пользователей на вашем домене. Хотя реализация проста, истинная сила iFrame заключается в его способности динамически настраиваться с использованием JavaScript, превращая стандартный процесс верификации в бесшовный фирменный пользовательский путь.
iFrame InContext идеально подходит для сценариев, когда вам нужен ограниченный процесс верификации без перенаправления пользователей. Он поддерживает как UniLink (не требуется бэкенд для быстрой настройки), так и API Session (для полной настройки с бэкендом). Встраивая iFrame, вы можете использовать расширенные функции Didit, включая OCR, анализ MRZ и декодирование штрих-кодов для верификации документов, сохраняя при этом контроль над окружающим пользовательским интерфейсом.
Динамическая настройка с помощью API postMessage JavaScript
Хотя iFrame обеспечивает встроенный опыт, поддержание согласованности бренда на протяжении всего пользовательского пути имеет решающее значение. Именно здесь API postMessage JavaScript становится бесценным. Поскольку iFrame загружает контент из другого источника (сервис верификации Didit), прямое манипулирование DOM блокируется политикой одного источника. Однако postMessage обеспечивает безопасную кросс-доменную связь между вашей родительской страницей и встроенным iFrame Didit.
Прослушивая определенные события или сообщения из iFrame и отправляя сообщения в него, вы можете динамически изменять его внешний вид или поведение. Например, вы можете:
- Изменить высоту или ширину iFrame в зависимости от загруженного в нем контента.
- Запускать определенные действия на вашей родительской странице при завершении шага верификации внутри iFrame.
- Передавать параметры стиля в iFrame, чтобы они соответствовали теме вашего приложения, если это поддерживается конфигурацией iFrame Didit.
Типичная настройка включает:
- Встраивание iFrame Didit с его атрибутом
src, указывающим на URL верификации (например,https://verify.didit.me/u/YOUR_WORKFLOW_ID_BASE64). - Добавление прослушивателя событий в ваше родительское окно для перехвата сообщений из iFrame:
window.addEventListener('message', (event) => {
// Убедитесь, что сообщение поступило из доверенного источника (домена Didit)
if (event.origin !== 'https://verify.didit.me') return;
const data = event.data;
if (data.type === 'didit-verification-event') {
console.log('Didit iFrame event:', data.payload);
// Обрабатывайте события, такие как 'verification_completed', 'verification_failed' и т. д.
}
});
Это позволяет вашему приложению интеллектуально реагировать на статус iFrame, более эффективно управляя пользовательским опытом.
Улучшение пользовательского опыта и обработка событий
По-настоящему бесшовный пользовательский опыт выходит за рамки простого встраивания. Он включает в себя предоставление четкой обратной связи, управление состояниями и корректную обработку различных результатов процесса верификации. Интеграция iFrame Didit, особенно в сочетании с JavaScript, позволяет осуществлять сложную обработку событий, которая может значительно улучшить UX.
Например, при успешной верификации (которую ваш бэкенд подтвердит через веб-хуки) вы можете программно закрыть модальное окно, содержащее iFrame, отобразить сообщение об успехе и зарегистрировать пользователя. Если верификация не удалась или была отменена, вы можете предоставить варианты повторной попытки или обращения в службу поддержки.
Рассмотрим сценарий, когда вы используете верификацию личности Didit для регистрации новых пользователей. После того как пользователь завершит захват и отправку документов в iFrame, Didit обрабатывает данные, включая выполнение пассивных и активных проверок на живость для предотвращения мошенничества с дипфейками. Ваш бэкенд получает веб-хук с результатами верификации. Затем вы можете использовать JavaScript для:
- Скрытия индикатора загрузки, как только iFrame отправит событие 'verification_submitted'.
- Обновления пользовательского интерфейса для отображения 'Верификация в ожидании', пока ваш бэкенд обрабатывает веб-хук.
- Отображения 'Верификация одобрена' или 'Верификация отклонена' на основе окончательного статуса, полученного вашим бэкендом и переданного на фронтенд.
Этот уровень динамического взаимодействия гарантирует, что пользователи всегда будут информированы и вовлечены, что снижает процент отказов и повышает доверие к вашей платформе.
Выбор правильной интеграции: iFrame против JavaScript SDK
В то время как iFrame InContext предлагает быструю настройку и удобство встраивания, Didit также предоставляет мощный JavaScript SDK для тех, кому требуется максимальный программный контроль. SDK, рекомендованный для производственных приложений, предлагает управление сессиями, обратные вызовы событий и полную поддержку TypeScript, что делает его идеальным для сложных приложений, созданных с использованием React, Vue, Angular или чистого JS.
iFrame отлично подходит для минимального времени настройки, часто менее 1 минуты, и для сценариев, когда вам нужен ограниченный, готовый к использованию процесс верификации. Однако для обратных вызовов событий в реальном времени и полного программного контроля над пользовательским потоком JavaScript SDK обеспечивает превосходную гибкость. Оба метода поддерживают кросс-платформенную верификацию и брендирование, обеспечивая согласованность бренда.
Приверженность Didit подходу «разработчик в первую очередь» означает, что у вас есть варианты интеграции верификации личности таким образом, который наилучшим образом соответствует вашему техническому стеку и целям пользовательского опыта. Будь то простота iFrame или мощь SDK, вы можете использовать платформу Didit на основе ИИ для создания безопасных и эффективных рабочих процессов идентификации.
Как помогает Didit
Didit предоставляет основные строительные блоки для создания высоконастраиваемых и безопасных систем верификации личности. Наша модульная архитектура позволяет вам подключать и использовать проверки личности, такие как верификация личности, пассивная и активная проверка на живость, а также сопоставление лиц 1:1 и поиск лиц, все это работает на основе передового ИИ. Для встроенных решений iFrame InContext предлагает невероятно быструю настройку, позволяя развернуть надежную верификацию с минимальными усилиями. Для тех, кому требуется более глубокая интеграция и динамический контроль, наш JavaScript SDK предоставляет инструменты для создания индивидуальных пользовательских сценариев, обработки событий в реальном времени и поддержания полной непрерывности бренда.
Платформа Didit разработана с учетом потребностей разработчиков, предлагая мгновенную песочницу, обширную общедоступную документацию и чистые API. Мы отменяем плату за настройку и предлагаем бесплатный уровень Core KYC, делая верификацию личности корпоративного уровня доступной. Наш подход, основанный на ИИ, обеспечивает высокую точность и автоматизацию, снижая потребность в ручных проверках и оптимизируя ваши операции. С Didit вы можете управлять рисками и автоматизировать доверие по всему миру, обеспечивая безопасный и удобный для пользователя опыт для ваших клиентов, соблюдая при этом требования соответствия.
Готовы начать?
Готовы увидеть Didit в действии? Получите бесплатную демонстрацию сегодня.
Начните бесплатно верифицировать личности с помощью бесплатного уровня Didit.