Usage¶
-
Import the component into your application
import 'idlive-face-capture-web';
-
Add the component's html tag to the place on the page where you want to display the video from the camera
<idlive-face-capture></idlive-face-capture>
NOTE: The component occupies 100% of the parent's element. Make sure it has a non-zero height and width
-
Get the component to interact with
const idliveFaceCapture = document.querySelector('idlive-face-capture');
-
Call
openCamera
action to open the camera and show videoidliveFaceCapture.openCamera();
-
Subscribe to
capture
event to get an encrypted file for verification after the photo is capturedidliveFaceCapture.addEventListener('capture', (event) => { const { photo, encryptedFile } = event.detail[0]; sendEncryptedFileToServer(encryptedFile) });
-
Implement a method to interact with the IAD server
const sendEncryptedFileToServer = (encryptedFile) => { const serverUrl = 'https://IAD_SERVER_URL:PORT'; fetch(`${serverUrl}/check_capture_liveness`, { method: 'post', headers: { 'Content-Type': 'application/octet-stream' }, body: encryptedFile, }) .then(response => response.json()) .then(result => { // process result from the server }) .catch(e => { // error }); }