Cree una aplicación de identificación facial segura con la Video API de Vonage

En la actual pandemia mundial, muchos sectores verticales de la industria han maximizado la adopción digital para aumentar la productividad y aportar técnicas de implementación eficaces que sirvan a casos de uso generalizados para su base de clientes. La identificación facial es cada vez más frecuente, lo que demuestra la amplia proliferación de esta tecnología en sectores verticales como:

1. Hostelería (aerolíneas y gestión hotelera)

• Proceso de pago en el registro del hotel mediante teléfono móvil o cámara suministrada por sus proveedores

• Facturación de vuelos y proceso de embarque

1. Telemedicina

• Identificación de pacientes cuando se necesitan servicios de urgencias para ayudar a minimizar el papeleo manual

• Servicios de gestión hospitalaria, mediante el cribado facial de médicos, pacientes y enfermeros para evitar errores de comunicación y proporcionar información coherente que transmitir

1. Atención al cliente

• Identificación del usuario

• Prevención del fraude

1. Registro de votantes

• Gestionar el fraude electoral

En todos los casos de uso mencionados anteriormente, se puede habilitar la identificación facial mediante la Video API de Vonage que impulsará los servicios sin contacto y, al mismo tiempo, protegerá los datos del usuario y la información personal mientras te ayuda a ofrecer soluciones personalizadas seguras y protegidas.

En esta entrada de blog, le guiaremos a través de nuestra Video API utilizando el ID facial. Sólo tomará unos pocos métodos y funciones para que sus desarrolladores entiendan el flujo de trabajo, incluyendo suscribirse, detectar, identificar y hacer coincidir la identificación facial personalizando estos atributos en sus construcciones de soluciones personalizadas. Nuestro objetivo es reducir el tiempo de desarrollo empezando con buen pie utilizando nuestra base de código de muestra que está lista para usar para la identificación facial utilizando nuestra plataforma opentok.

Resumen

Para construir una aplicación completa de identificación facial utilizando nuestra Video API, utilizamos métodos y objetos como se menciona en nuestro fragmento de código de ejemplo, puede encontrar más información en nuestro código de referencia opentok integrado con Microsoft face API.

Tecnologías y requisitos previos

• API JS de Opentok

• API facial de Microsoft

• Cuenta de Video API de Vonage

Subir al servidor una captura de pantalla de la imagen del abonado

En el caso de uso apropiado mencionado, el cliente proporciona su fotografía durante el proceso de inscripción, que luego se almacena en el backend. Cuando el cliente se haya unido a la videollamada, podemos utilizar la Video API de Vonage para tomar una captura de pantalla del flujo de vídeo del cliente y subirla al servidor para la detección facial.

En el código siguiente, hemos utilizado subscriber.getImgData() para obtener una pantalla del flujo de vídeo y subirla al backend.

function sendScreenShot() {
    var imgdata = undefined;
    if (subscriber) {
        imgdata = subscriber.getImgData();
    }
    if (imgdata != undefined) {
        try {
            var blob = this.b64toBlob(imgdata, "image/png");
            let formData = new FormData();
            formData.append('customer', blob);
            let res = await $HTTPDEMO.post('/faceIDDemo.php',
                formData, {
                    headers: {
                        'Content-Type': 'multipart/form-data'
                    }

                }
            );
            console.log(res.data);
            if (res.data.status != "success") {
                alert("Error uploading the file");
            } else {

            }
        } catch (error) {
            alert("error posting screenshot");
            console.log(error);
        }
    }
}

step 1

b64toBlob es un método de ayuda llamado por la función sendScreenShot que convierte la cadena base64 en una matriz de bytes para que podamos enviarla como multipart/form-data al servidor.

function b64toBlob(b64Data, contentType, sliceSize) {
    contentType = contentType || '';
    sliceSize = sliceSize || 512;
    var byteCharacters = atob(b64Data);
    var byteArrays = [];
    for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
        var slice = byteCharacters.slice(offset, offset + sliceSize);
        var byteNumbers = new Array(slice.length);
        for (var i = 0; i < slice.length; i++) {
            byteNumbers[i] = slice.charCodeAt(i);
        }
        var byteArray = new Uint8Array(byteNumbers);
        byteArrays.push(byteArray);
    }
    var blob = new Blob(byteArrays, {
        type: contentType
    });
    return blob;
}

Identificación de FaceID mediante la API de Microsoft para comparar resultados de Face ID coincidentes

Identifying FaceID Using Microsoft API To Compare Matched Face ID Results

Detección de FaceID en Opentok

El método detectFace se ejecuta en el lado del servidor. Detecta los rasgos faciales de una imagen dada y devuelve un identificador. Llamamos a este método dos veces: primero cuando se ha cargado la imagen del cliente en el momento del registro (id1) y después con la captura de pantalla del flujo de vídeo (id2).

A continuación se muestra un fragmento de código de ejemplo:

function detectFace($img){
        global $faceid_endpoint, $data_dir_url,$faceid_key;

        $client = new GuzzleHttp\Client([
            'base_uri' => $faceid_endpoint
        ]);

        $resp = $client->request('POST', 'face/v1.0/detect?recognitionModel=recognition_02&detectionModel=detection_02', [
            'headers' => [
                'Content-Type' => 'application/json',
                'Ocp-Apim-Subscription-Key' => $faceid_key
            ],
            'json' => ['url'=> $data_dir_url.$img]
        ]);

        $json = json_decode($resp->getBody(),true);
       
        return $json[0];
}

Detecting FaceID in Opentok

Verificación de FaceID en OpenTok

Para la última parte de la verificación, utilizamos el método verifyFace() y pasamos los ID de imagen id1 e id2 como entradas. Aquí, la API de rostros de Microsoft compara estos dos rostros (id1 e id2), compara la instantánea con la fotografía enviada durante el proceso de registro y proporciona un resultado que incluye coincidencia/no coincidencia y una puntuación.

function verifyFace($id1,$id2){
        global $faceid_endpoint, $data_dir_url,$faceid_key;
        $client = new GuzzleHttp\Client([
            'base_uri' => $faceid_endpoint
        ]);

        $resp = $client->request('POST', 'face/v1.0/verify', [
            'headers' => [
                'Content-Type' => 'application/json',
                'Ocp-Apim-Subscription-Key' => $faceid_key
            ],
            'json' => [
                'faceid1'=>$id1,
                'faceid2'=>$id2
            ]
        ]);

        return $resp->getBody();
}

Verifying FaceID in OpenTok

Fondo

El objetivo principal del equipo de soluciones para clientes de Vonage API es permitir que nuestros desarrolladores superen las barreras de la innovación mediante la ampliación de los servicios de desarrollo, integración y soporte. Trabajamos con nuestros líderes globales que comparten un objetivo común para lograr negocios sostenibles con el objetivo de convertirse en empresas rentables centradas en el cliente acelerando su tasa de crecimiento global.

Parte de nuestra oferta de servicios acelerados consiste en minimizar los plazos de desarrollo mediante la implantación guiada, el despliegue y la adopción óptima que le ayudarán a optimizar, escalar su aplicación y llegar antes al mercado.

Conclusión

En Vonage, nos centramos en nuestros valores fundamentales anteponiendo el interés del cliente. Con nuestros esfuerzos constantes en innovación incesante, nos comprometemos a servir a nuestra comunidad de desarrolladores con las últimas y mejores funciones, lo que te permite personalizar tu aplicación para que se adapte mejor a tus escenarios de casos de uso.

Constantemente vemos un aumento en nuestro uso de video y con nuestra demanda incremental de Video, estamos más enfocados en desplegar recursos calificados para ayudarte y servirte mejor para lograr integraciones exitosas con nuestros socios y nosotros. Es fácil comenzar a usar la Video API de Vonage, así que inscríbete para obtener tu Account gratis ¡y aprovecha al máximo nuestra oferta hoy mismo!

Nos encantaría recibir sus comentarios sobre las funciones, la documentación para desarrolladores y el contenido de las entradas del blog. Déjenos un comentario a continuación o póngase en contacto con nosotros en Twitter o únete a nuestro Canal Slack de la comunidad.