Reconnaissance faciale en temps réel avec vidéo acquise par getUserMedia [HTML5, openCV]

politique

Tout d'abord, vous pouvez utiliser l'API HTML5 `` getUserMedia '' pour obtenir les images de votre caméra locale. Puisque la vidéo est réalisée en faisant avancer l'image fixe image par image, l'image peut être coupée à un moment spécifique et une reconnaissance faciale peut être appliquée à l'image. La reconnaissance faciale se fait côté serveur. L'image découpée côté local est encodée en base64 et envoyée au serveur par Ajax, et côté serveur, la base64 est décodée et entrée dans le reconnaissance de visage. Ensuite, le résultat est renvoyé côté client.

environnement

L'environnement peut être n'importe quoi. Ce qui suit est prouvé dans mon environnement.

Reconnaissance de visage

Celui qui reçoit base64 et reconnaît le visage http://qiita.com/komakomako/items/91eb5bba927b23587ed4

l'extrémité avant

<header class="hero-unit" id="banner">
  <div class="container">
 <h1> Reconnaissance faciale </ h1>
  </div>
</header>

<div class="container">
  <div class="row">
    <div class="col-lg-12">
      <br>
      <button class="btn btn-lg btn-success" onclick="startVideo()">Start</button>
      <br>
      <canvas style="display:true;" width="640" height="480"></canvas>
      <video id="local_video" width="640" height="480" autoplay style="display: true;"></video>

    </div>
  </form>
</div>

<script type="text/javascript">
  var localVideo  = document.getElementById('local_video');
  var canvas = document.querySelector('canvas');
  var ctx = canvas.getContext('2d');
  var localStream = null;

 // Les coordonnées pour dessiner le résultat de la reconnaissance faciale dans un cadre carré
  var x = []

  var base64 = ''

 // Lancer la vidéo locale
  function startVideo() {
    navigator.mediaDevices.getUserMedia({video: true, audio: false})
    .then(function (stream) { // success
      localStream = stream;
      localVideo.src  = window.URL.createObjectURL(localStream);
    }).catch(function (error) { // error
      console.error('mediaDevice.getUserMedia() error:', error);
      return;
    });
  }

 // Capture d'image de la caméra
  var capture = function() {
    if (localStream) {
      ctx.drawImage(localVideo, 0, 0);
      ctx.beginPath();
      ctx.rect(x[0], x[1], x[2], x[3]);
      ctx.stroke();
      base64 = canvas.toDataURL('image/webp');
    }
  }

 //認識
  var detect = function() {
    var request = {
      url: 'http://localhost:9000/api/detect',
      method: 'POST',
      data: {
        image: base64.replace(/^.*,/, '')
      }
    };
    $.ajax(request).done(function(data){
       console.log(data)
       if(data.face) {
         for(var i=0; i<data.face.split(' ').length; i++){
           x[i] = data.face.split(' ')[i] - 0 ;
         }
         console.log(data.face.split(' '));
       }
    });
  }

  setInterval("capture()",100);
  setInterval("detect()",500);

</script>

serveur

Si vous atteignez le point de terminaison `` http: // localhost: 9000 / api / detect '' avec POST, il sera acheminé vers la fonction suivante.

export function detect(req, res) {

  const exec = require('child_process').exec;
  exec('python /path/to/detect_base64.py "' + req.body.image + '"',
    function(err, stdout, stderr) {
      if (err) { console.log(err); }
      console.log(stdout);
      return res.status(201).json({"face": stdout});
    }
  );

}

Recommended Posts

Reconnaissance faciale en temps réel avec vidéo acquise par getUserMedia [HTML5, openCV]
Reconnaissance faciale avec OpenCV de Python
Reconnaissance faciale / coupe avec OpenCV
Essayez la reconnaissance faciale avec python + OpenCV
Reconnaissance faciale avec caméra avec opencv3 + python2.7
Reconnaissance d'objets avec openCV par traincascade
J'ai essayé la reconnaissance faciale avec OpenCV
Enregistrer la vidéo image par image avec Python OpenCV
[python, openCV] base64 Reconnaissance faciale dans les images
Reconnaissance faciale avec Edison
Notification LINE à partir de la reconnaissance vidéo en temps réel avec le SDK DeepStream
Améliorez rapidement la précision de détection en spécifiant les paramètres avec la détection de visage openCV
Reconnaissance faciale par Amazon Rekognition
Chargement de la vidéo en boucle avec opencv
J'ai essayé de reconnaître le visage de la vidéo (OpenCV: version python)
Détection des bords en temps réel avec OpenCV
Détection de visage avec Python + OpenCV
Essayez la reconnaissance faciale avec Python
Découpez une image d'une vidéo toutes les secondes avec Python + OpenCV
Reconnaissance d'image avec Keras + OpenCV
Détection de visage d'anime avec OpenCV
ZOOM en remplaçant votre visage par une icône Twitter avec la reconnaissance faciale openCV
Principes de base du traitement d'image en temps réel avec opencv
[OpenCV] Identification personnelle avec photo du visage
Première reconnaissance faciale d'anime avec Chainer
Découpez le visage avec Python + OpenCV
Reconnaissance faciale à l'aide d'OpenCV (classificateur de caractéristiques de type Haar)
Détection de visage avec Python + OpenCV (rotation invariante)
[Python] Détection de visage par OpenCV (Haar Cascade)
Créer un lecteur vidéo avec PySimpleGUI + OpenCV
Reconnaissance faciale des membres Momokuro par TensorFlow (partie 1)
Reconnaissance faciale des personnages d'anime avec Keras
Reconnaissance faciale des membres Momokuro par TensorFlow (partie 2)
API de reconnaissance faciale sans serveur conçue avec Python