Захват документа

Захват документов, удостоверяющих личность. SDK отображает рамку, помогающую пользователю правильно расположить документ; после позиционирования пользователь нажимает кнопку для съёмки фото.

Без проверки содержимого

SDK не выполняет никакой проверки содержимого захватываемого изображения.

Доступные рамки документов

Рамка	Описание
`DocumentCameraTypes.CPF`	Захват CPF
`DocumentCameraTypes.CNH`	Захват открытого CNH
`DocumentCameraTypes.CNH_FRENTE`	Захват лицевой стороны CNH
`DocumentCameraTypes.CNH_VERSO`	Захват обратной стороны CNH
`DocumentCameraTypes.RG_FRENTE`	Захват лицевой стороны RG
`DocumentCameraTypes.RG_VERSO`	Захват обратной стороны RG
`DocumentCameraTypes.RG_FRENTE_NOVO`	Захват лицевой стороны нового RG
`DocumentCameraTypes.RG_VERSO_NOVO`	Захват обратной стороны нового RG
`DocumentCameraTypes.OTHERS("description")`	Универсальная рамка для любого другого документа

Универсальная рамка

Если необходимо захватить документ, для которого нет специальной рамки (например, RNE), используйте DocumentCameraTypes.OTHERS("description") — универсальную прямоугольную рамку, подходящую для любого захвата.

Полный список поддерживаемых типов документов см. в разделе Справочник API > Перечисления.

Размер рамки

Рекомендуется настроить размер рамки в вашем приложении для оптимизации области захвата.

Влияние CSS

Работа рамки может быть затронута дизайн-системами с компонентами сетки (Bootstrap, Material-UI и др.). Чтобы минимизировать этот риск, размещайте рамку (id="box-camera") там, где она не наследует нежелательные правила CSS.

Desktop
Mobile

Оберните рамку в родительский элемент для ограничения её размеров:

<div class="container">
  <div id="box-camera"></div>
</div>

.container {
  width: 800px;
  height: 600px;
  position: relative;
}

Соблюдайте правильное соотношение высоты к ширине, чтобы облегчить пользователю центрирование лица в рамке.

Изменение размера в инструментах разработчика

Тесты с изменением размера экрана через режим разработчика браузера работать не будут. Изменяйте размер непосредственно окна браузера.

Для веб-просмотра на мобильных устройствах рамка захвата должна занимать 100% экрана устройства (100vw/100vh), чтобы избежать проблем с алгоритмами компьютерного зрения. Избегайте горизонтальной и вертикальной прокрутки — использование модального окна помогает минимизировать их.

Тестируйте на физических устройствах

Тестирование в режиме разработчика браузера не работает — камера, используемая браузером, совпадает с камерой рабочего стола и существенно отличается по разрешению от камеры мобильного устройства. Тестируйте непосредственно на устройстве.

Запуск захвата документа

Шаг 1 — Реализуйте объект callback

Web SDK использует объект callback — передаваемый в open() — для обработки событий успеха и ошибки. Оба обработчика обязательны:

Обработчик	Когда вызывается
`on.success(obj)`	Захват завершён успешно — получает объект с `base64` и `encrypted`
`on.error(error)`	В ходе сессии произошла ошибка — получает `ErrorBio`

const callback = {
  on: {
    success: (obj) => {
      console.log(obj.base64);
      console.log(obj.encrypted);
    },
    error: (error) => {
      console.error(error);
    }
  }
};

Обязательный callback

Объект callback обязателен. Если он реализован некорректно (без обоих событий success и error), SDK генерирует исключение, которое при отсутствии обработки отображается в консоли пользователя.

Шаг 2 — Создайте камеру и подготовьте сессию захвата документа

Создайте экземпляр камеры и вызовите prepareDocumentCamera, передав UnicoConfig и нужный тип DocumentCameraTypes:

const unicoCamera = unicoCameraBuilder.build();

const config = new UnicoConfig()
  .setHostname("<YOUR_HOSTNAME>")
  .setHostKey("<YOUR_HOST_KEY>");

unicoCamera.prepareDocumentCamera(
  config,
  DocumentCameraTypes.CNH
).then(cameraOpener => {
  cameraOpener.open(callback);
}).catch(error => {
  console.error(error);
});

Полное описание обработки результата см. в разделе Получение результата.