Работа с web-компонентой
Web-компонента - это инструмент захвата изображений, с помощью которого пользователь может выполнять регистрацию и авторизацию через веб-интерфейс. Обратите внимание, что web-компонента работает только в браузерах, основанных на Chromium.
Установка web-компоненты
Web-компонента поставляется как npm-пакет в составе BAF в виде .tgz архива. Для установки web-компоненты поместите ее в корень вашего проекта рядом с файлом package.json.
В package.json в раздел dependencies добавьте строку:
"@tdv/onboarding": "tdv-onboarding-2.2.21.tgz".
Версия архива может отличаться. Пример итогового файла package.json:
После этого вызовите команду npm install
, которая установит библиотеку в ваш проект.
Импорт и использование web-компоненты
Импортируйте библиотеку, а также стили для нее. При желании стилизация может быть переписана пользователем. Пример импорта библиотеки и стилей:
Теперь инициализируйте web-компоненту. Для этого заполните файл конфигурации, подробное описание которого можно посмотреть ниже:
Описание конфигурации web-компоненты
el (string) - id элемента на странице, куда интегрируется web-компонента (обязательное поле).
applicantId (string) - id аппликанта (обязательное поле).
domainId (string) - id домена, содержащего настройки и стили для web-компоненты (обязательное поле).
domainApi (string) - URL адрес для доступа к API (обязательное поле).
publicKey (string) - публичный ключ для доступа к API (обязательное поле).
isAuth (boolean) - флаг указывающий, что необходима только авторизация пользователя.
faceOnly (boolean) - флаг указывающий, что регистрация и авторизация должны быть только по лицу.
chunkPublicPath (string) - путь к папке с чанками. Укажите путь на сервере, если вам нужно переместить папку в другое место. Путь по умолчанию — 'networks'.
networkUrl (string) - путь к папке с нейросетями. Укажите путь на сервере, если вам нужно переместить папку в другое место. Путь по умолчанию — 'networks'.
useCDN (boolean) - флаг включается, если вы хотите загружать 'networks' с CDN, а не со своего домена.
preferApiConfig (boolean) - флаг включается, если вы предпочитаете использовать конфигурацию библиотеки TDV, отправленную из BAF API, вместо конфигурации, использованной при инициализации оболочки.
hideDocumentTitle (boolean) - эта опция включает/отключает отображение заголовков документов.
processingImageFormat (string) - эта опция переключает формат изображения, используемый для обработки изображения.
callbacks (object) - объект с функциями обратного вызова. Доступны следующие функции:
onChange - функция обратного вызова, которая будет вызываться после прохождения каждого шага. Возвращаемое значение — это объект с типом и изображением.
onCameraError - функция, вызываемая в случае, если камера недоступна. Значением ответа является объект с кодом ошибки и сообщением.
onReset - функция обратного вызова, которая будет вызываться после сброса всех шагов. Возвращаемое значение — это объект с шагами.
onRetakeHook - функция, которая будет вызываться перед сбросом текущего шага. Возвращаемое значение — это объект с текущим шагом.
onValidate - функция, которая будет вызываться после получения ответа проверки. Возвращаемое значение — это объект с информацией проверки.
onError - функция, которая будет вызываться в случае ошибки. Значением ответа является объект с кодом ошибки и сообщением.
onReloaded - функция, которая будет вызвана после завершения перезагрузки компоненты. Эта функция не возвращает значение.
onMounted - функция, которая будет вызываться на смонтированной компоненте. Эта функция не возвращает значение.
submit - функция обратного вызова, которая будет вызвана после выполнения всех шагов. Возвращаемое значение — это объект со следующим содержимым:
Пример инициализации web-компоненты:
Методы web-компоненты
Restart
Метод restart полностью перезапускает web-компоненту с той же конфигурацией, с которой она была инициализирована.
Пример использования:
Set applicant
Метод setApplicant перезапускает компоненту с переданным аппликантом и с той же конфигурацией, с которой она была инициализирована.
Пример использования:
Update config
Метод updateConfig перезапускает компоненту с переданной конфигурацией.
Пример использования: