メインコンテンツへスキップ

ドキュメントキャプチャ

本人確認書類のキャプチャ。SDK はユーザーが書類を正しく配置できるようにフレームを表示します。配置が完了したら、ユーザーはボタンをクリックして写真を撮影します。

コンテンツの検証なし

SDK はキャプチャされた内容に対していかなる検証も行いません。

利用可能なドキュメントフレーム
フレーム説明
DocumentCameraTypes.CPFCPF をキャプチャ
DocumentCameraTypes.CNH開いた CNH をキャプチャ
DocumentCameraTypes.CNH_FRENTECNH の表面をキャプチャ
DocumentCameraTypes.CNH_VERSOCNH の裏面をキャプチャ
DocumentCameraTypes.RG_FRENTERG の表面をキャプチャ
DocumentCameraTypes.RG_VERSORG の裏面をキャプチャ
DocumentCameraTypes.RG_FRENTE_NOVO新しい RG の表面をキャプチャ
DocumentCameraTypes.RG_VERSO_NOVO新しい RG の裏面をキャプチャ
DocumentCameraTypes.OTHERS("description")その他の書類用の汎用フレーム
汎用フレーム

専用フレームが存在しない書類（例: RNE）をキャプチャする必要がある場合は、DocumentCameraTypes.OTHERS("description") を使用してください。これはあらゆるキャプチャのガイドに利用できる汎用の長方形フレームです。

サポートされているドキュメントタイプの完全なリストについては、API リファレンス > Enums を参照してください。

フレームサイズ

キャプチャ領域を最適化するために、アプリケーション内でフレームのサイズを設定することを推奨します。

CSS の干渉

フレームの機能は、グリッドコンポーネントを含むデザインシステム（Bootstrap、Material-UI など）の影響を受ける場合があります。このリスクを最小化するために、フレーム（id="box-camera"）は不要な CSS ルールを継承しない場所に配置してください。

フレームの寸法を制限するために、親要素でラップします:

<div class="container">
  <div id="box-camera"></div>
</div>
.container {
  width: 800px;
  height: 600px;
  position: relative;
}

ユーザーの顔をフレームに収めやすくするために、適切な高さと幅の比率を維持してください。

開発者ツールのリサイズ

ブラウザの開発者モードを使用した画面リサイズのテストは、期待どおりに機能しません。ブラウザウィンドウを直接リサイズしてください。

ドキュメントキャプチャの開始
ステップ 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 — カメラを構築し、ドキュメントセッションを準備する

カメラインスタンスを構築し、UnicoConfig と目的の DocumentCameraTypes を渡して prepareDocumentCamera を呼び出します:

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

結果の完全な処理については、結果の受け取り を参照してください。

最終更新 に