紹一個網站,演示了通過 HTML5 + JavaScript 技術實現的人臉識別,目前僅適用於 Chrome浏覽器,首先需要在地址欄輸入 about:flags ,然後找到“啟用 MediaStream” 這一項,點擊“啟用” 後重啟 Chrome 浏覽器
然後打開下面地址:
http://neave.com/webcam/html5/face/
當你搖頭晃腦的時候,那副眼鏡會跟著移動並幫你戴上眼鏡。
你可以查看網頁源碼來了解具體的實現細節。
———————————–我是分界線———————————————
這是一篇國外的文章,介紹如何通過 WebRTC、OpenCV 和 WebSocket 技術實現在 Web 浏覽器上的人臉識別,架構在 Jetty 之上。
實現的效果包括:
還能識別眼睛
人臉識別的核心代碼:
頁面:
XML/HTML Code復制內容到剪貼板
- <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>
JavaScript Code復制內容到剪貼板
- public class FaceDetection {
-
- private static final String CASCADE_FILE ="resources/haarcascade_frontalface_alt.xml";
-
- private int minsize = 20;
-