使用 HTML5, javascript, webrtc, websockets, Jetty 和 OpenCV 实现基于 Web 的人脸识别

这是一篇国外的文章，介绍如何通过 WebRTC、OpenCV 和 WebSocket 技术实现在 Web 浏览器上的人脸识别，架构在 Jetty 之上。

实现的效果包括：

还能识别眼睛

人脸识别的核心代码：

页面：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

<div>     <video id="live" width="320" height="240" autoplay style="display: inline;"></video>     <canvas width="320" id="canvas" height="240" style="display: inline;"></canvas> </div>     <script type="text/javascript">     var video = $("#live").get()[0];     var canvas = $("#canvas");     var ctx = canvas.get()[0].getContext('2d');        navigator.webkitGetUserMedia("video",             function(stream) {                 video.src = webkitURL.createObjectURL(stream);             },             function(err) {                 console.log("Unable to get video stream!")             }     )        timer = setInterval(             function () {                 ctx.drawImage(video, 0, 0, 320, 240);             }, 250); </script>

后台：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43

public class FaceDetection {        private static final String CASCADE_FILE = "resources/haarcascade_frontalface_alt.xml";        private int minsize = 20;     private int group = 0;     private double scale = 1.1;        /**      * Based on FaceDetection example from JavaCV.      */     public byte[] convert(byte[] imageData) throws IOException {         // create image from supplied bytearray         IplImage originalImage = cvDecodeImage(cvMat(1, imageData.length,CV_8UC1, new BytePointer(imageData)));            // Convert to grayscale for recognition         IplImage grayImage = IplImage.create(originalImage.width(), originalImage.height(), IPL_DEPTH_8U, 1);         cvCvtColor(originalImage, grayImage, CV_BGR2GRAY);            // storage is needed to store information during detection         CvMemStorage storage = CvMemStorage.create();            // Configuration to use in analysis         CvHaarClassifierCascade cascade = new CvHaarClassifierCascade(cvLoad(CASCADE_FILE));            // We detect the faces.         CvSeq faces = cvHaarDetectObjects(grayImage, cascade, storage, scale, group, minsize);            // We iterate over the discovered faces and draw yellow rectangles around them.         for (int i = 0; i < faces.total(); i++) {             CvRect r = new CvRect(cvGetSeqElem(faces, i));             cvRectangle(originalImage, cvPoint(r.x(), r.y()),                     cvPoint(r.x() + r.width(), r.y() + r.height()),                     CvScalar.YELLOW, 1, CV_AA, 0);         }            // convert the resulting image back to an array         ByteArrayOutputStream bout = new ByteArrayOutputStream();         BufferedImage imgb = originalImage.getBufferedImage();         ImageIO.write(imgb, "png", bout);         return bout.toByteArray();     } }

详细的实现细节请阅读英文原文：

http://www.smartjava.org/content/face-detection-using-html5-javascript-webrtc-websockets-jetty-and-javacvopencv