Results

Results provided by the Video Provider component.

The Video Provider component will record the user interaction with the widgets it contains. That record can be obtained after the capture process via a request to a URL.

---

How to obtain the recorded video from the extraction

Remote recording (default)

The recorded video will be provided from a URL once the extraction process has completed as a file blob (string).

The following variables must be configured to obtain the generated video:

• Operation ID: ID generated and provided by the SDK Provider. It can be obtained from the events emitOperationId or emitData.

• Video Recording API Key: API Key required by Video Provider. Provided by the Facephi team.

• Video Recording URL: URL from which the recorded video will be downloaded. Provided by the Facephi team.

How to obtain the generated video

The API Key must be added in the request header:

fetch('https://example.url/operation-id-value', { headers: { 'x-api-key': process.env.VIDEO_RECORDING_APIKEY } });

Video request example

const apiKey = process.env.VIDEO_PROVIDER_APIKEY; // Clave secreta proporcionada por el equipo de Facephi
const videoRecordingUrl = 'https://example.url'; // URL proporcionada por el equipo de Facephi
const operationId = 'operation-id-value'; // Valor obtenido del evento emitOperationId

function fetchVideo() {
  const url = `${videoRecordingUrl}/${operationId}`;

  fetch(url, {
    headers: {
      'x-api-key': apiKey,
    },
  })
    .then((response) => response.text())
    .then((data) => {
      console.log('Video generado:', data); // El blob de video grabado se proporcionará como una URL (string)
    });
}

If the generated video is too short (less than two seconds) or if the request is made too soon after the extraction process ends, the request may fail.

---

Local Recording

// Detener la grabación de video una vez que el proceso de extracción completo haya finalizado.
const facephiSelphiWidget = document.getElementById("facephiSelphiWidget");
facephiSelphiWidget.addEventListener("extractionFinish", handleSelphiExtractionFinish);
function handleSelphiExtractionFinish(event) {
  const facephiVideoProvider = document.getElementById("facephiVideoProvider");
  const videoBlob = facephiVideoProvider.stopVideo();
}

Examples of how to use the video:

const videoBlob = await videoProvider.stopVideo();

if (videoBlob instanceof Blob) {
  // Reproducir el vídeo
  const videoUrl = URL.createObjectURL(videoBlob);
  const videoElement = document.createElement('video');
  videoElement.src = videoUrl;
  videoElement.controls = true;
  document.body.appendChild(videoElement);

  // Descagrar el vídeo
  const link = document.createElement('a');
  link.href = videoUrl;
  link.download = 'recording.mp4';
  link.click();
}