https://d226lax1qjow5r.cloudfront.net/blog/blogposts/build-a-secure-facial-id-application-using-the-vonage-video-api/Blog_Facial-ID-Application_1200x600-1.png

Erstellen einer sicheren Gesichts-ID-Anwendung mit der Vonage Video API

Zuletzt aktualisiert am May 10, 2021

Lesedauer: 3 Minuten

In der gegenwärtigen globalen Pandemie haben viele vertikale Branchen die digitale Übernahme maximiert, um die Produktivität zu steigern und effektive Implementierungstechniken für weit verbreitete Anwendungsfälle für ihren Kundenstamm bereitzustellen. Die Gesichtserkennung hat sich immer mehr durchgesetzt, was die weite Verbreitung dieser Technologie in verschiedenen Branchen belegt:

  1. Gastgewerbe (Fluggesellschaften und Hotelmanagement)

  • Bezahlvorgang beim Einchecken im Hotel über das Mobiltelefon oder die von den Anbietern bereitgestellte Kamera

  • Flugabfertigung und Boarding-Prozess

  1. Telemedizin

  • Identifizierung von Patienten, die einen Notdienst benötigen, um den manuellen Papierkram zu minimieren

  • Krankenhausverwaltungsdienste durch Screening der Gesichter von Ärzten, Patienten und Krankenschwestern, um Missverständnisse zu vermeiden und einheitliche Informationen zu liefern, die weitergegeben werden können

  1. Kundenbetreuung

  • Benutzeridentifikation

  • Betrugsprävention

  1. Registrierung der Wähler

  • Wählerbetrug bekämpfen

In allen oben genannten Anwendungsfällen kann die Gesichtserkennung über die Vonage Video API aktiviert werden, um kontaktlose Dienste zu nutzen und gleichzeitig Ihre Benutzerdaten und persönlichen Informationen zu schützen und Ihnen zu helfen, sichere und maßgeschneiderte Lösungen anzubieten.

In diesem Blogbeitrag führen wir Sie durch unsere Video API unter Verwendung von Facial ID. Ihre Entwickler benötigen nur wenige Methoden und Funktionen, um den Arbeitsablauf zu verstehen, einschließlich Abonnieren, Erkennen, Identifizieren und Abgleichen der Gesichtserkennung durch Personalisierung dieser Attribute in ihren benutzerdefinierten Lösungen. Unser Ziel ist es, die Entwicklungszeit zu verkürzen, indem wir mit einem guten Vorsprung starten und unsere Beispiel-Codebasis verwenden, die für die Gesichtserkennung mit unserer opentok-Plattform.

Abstrakt

Um eine vollständige Gesichtserkennung mit unserer Video API zu erstellen, verwenden wir Methoden und Objekte, wie in unserem Beispielcodeausschnitt erwähnt. Weitere Informationen finden Sie in unserer opentok Referenzcode integriert mit Microsoft Face API.

Technologien und Voraussetzungen

Hochladen eines Screenshot des Teilnehmerbildes auf den Server

In dem genannten Anwendungsfall gibt der Kunde bei der Anmeldung sein Foto ab, das dann im Backend gespeichert wird. Wenn der Kunde dem Videoanruf beigetreten ist, können wir die Vonage Video API verwenden, um einen Screenshot des Videostreams des Kunden zu erstellen und ihn zur Gesichtserkennung auf den Server hochzuladen.

Im folgenden Code haben wir mit subscriber.getImgData() verwendet, um einen Bildschirm des Video-Streams zu erhalten und ihn ins Backend hochzuladen.

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 1step 1

b64toBlob ist eine Hilfsmethode, die von der Funktion sendScreenShot aufgerufen wird und die base64-Zeichenfolge in ein Byte-Array umwandelt, damit wir sie als Multipart/Formulardaten an den Server senden können.

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

Identifizierung von FaceID mit Hilfe der Microsoft API zum Vergleich übereinstimmender FaceID-Ergebnisse

Identifying FaceID Using Microsoft API To Compare Matched Face ID Results Identifying FaceID Using Microsoft API To Compare Matched Face ID Results

Erkennung von FaceID in Opentok

Die Methode detectFace läuft auf der Serverseite. Sie erkennt die Gesichtsmerkmale aus einem gegebenen Bild und gibt einen Identifikator zurück. Wir rufen diese Methode zweimal auf: zuerst, wenn das Bild des Kunden zum Zeitpunkt der Anmeldung hochgeladen wurde (id1) und dann mit dem Screenshot aus dem Video-Stream (id2).

Nachstehend finden Sie ein Beispiel für einen Codeausschnitt:

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 OpentokDetecting FaceID in Opentok

Verifizierung von FaceID in OpenTok

Für den letzten Teil der Überprüfung verwenden wir die Methode verifyFace() und übergeben die Bild-IDs id1 und id2 als Eingaben. Hier vergleicht die Microsoft Face API diese beiden Gesichter (id1 und id2), vergleicht den Schnappschuss mit dem Foto, das bei der Anmeldung eingereicht wurde, und liefert ein Ergebnis, das Übereinstimmung/Unstimmigkeit und eine Punktzahl enthält.

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 OpenTokVerifying FaceID in OpenTok

Hintergrund

Das Kundenlösungsteam von Vonage API hat das primäre Ziel, unsere Entwickler in die Lage zu versetzen, Innovationsbarrieren zu überwinden, indem es Entwicklungs-, Integrations- und Supportservices erweitert. Wir arbeiten mit unseren globalen Führungskräften zusammen, die ein gemeinsames Ziel verfolgen, um ein nachhaltiges Geschäft zu erreichen, das darauf abzielt, profitable, kundenorientierte Unternehmen zu werden, indem wir Ihre globale Wachstumsrate beschleunigen.

Ein Teil unseres beschleunigten Serviceangebots besteht darin, Ihre Entwicklungszeit zu minimieren, indem wir Ihnen eine geführte Implementierung, Bereitstellung und bestgeleitete Übernahme anbieten, die Ihnen hilft, Ihre Anwendung zu optimieren, zu skalieren und schneller auf den Markt zu bringen.

Schlussfolgerung

Bei Vonage konzentrieren wir uns auf unsere Kernwerte, indem wir die Interessen unserer Kunden in den Vordergrund stellen. Durch unsere ständigen Bemühungen um unermüdliche Innovation sind wir bestrebt, unserer Entwickler-Community die neuesten und besten Funktionen zur Verfügung zu stellen, damit Sie Ihre Anwendung optimal an Ihre Anwendungsszenarien anpassen können.

Wir stellen immer wieder einen Anstieg der Videonutzung fest, und angesichts der steigenden Nachfrage nach Video konzentrieren wir uns verstärkt auf den Einsatz qualifizierter Ressourcen, um Sie bei der erfolgreichen Integration mit unseren Partnern und uns besser unterstützen zu können. Der Einstieg in die Video API von Vonage ist denkbar einfach, also Registrieren Sie sich für Ihren kostenlosen Account und nutzen Sie die Vorteile unseres Angebots noch heute!

Wir würden uns über Ihr Feedback zu Funktionen, Entwicklerdokumenten und Blogpost-Inhalten freuen. Bitte hinterlassen Sie unten einen Kommentar, kontaktieren Sie uns auf Twitter oder treten Sie unserem Slack-Kanal der Gemeinschaft.

Teilen Sie:

https://a.storyblok.com/f/270183/250x250/a8981ee818/akshita-arun.png
Akshita Arun

Akshita is Customer Solutions Manager at Vonage with a background in technical account project management and solution architecture. Akshita has been working as a technical client advocate since 2015 and spends her days focused on consulting services helping her clients succeed.