Создайте приложение для обнаружения лиц, используя Node.js и OpenCV

 #main { margin-top: 50px; } .frame { position: relative; } .frame a { display: block; position: absolute; border: solid 2px #fff; border-radius: 50%; } .frame a:hover { background: rgba(0,0,0,0.5); } 

Теперь давайте реализуем скелетное приложение Express ( index.js ):

 var express = require('express') , http = require('http') , async = require('async') , multer = require('multer') , upload = multer({ dest: 'uploads/' }) , exphbs = require('express-handlebars') , easyimg = require('easyimage') , _ = require('lodash') , cv = require('opencv'); // MIME types for image uploads var exts = { 'image/jpeg': '.jpg', 'image/png' : '.png', 'image/gif' : '.gif' }; var port = 8080; var app = express(); app.use(express.static(__dirname + '/public')) // Configure Handlebars app.engine('.hbs', exphbs({ extname: '.hbs', defaultLayout: 'default' })); app.set('view engine', '.hbs'); /** * This is a placeholder for the application code */ http.createServer(app) .listen(port, function(server) { console.log('Listening on port %d', port); }); 

Надеемся, что комментарии предоставят вам понимание того, что здесь происходит.

Нам также понадобится простой маршрут GET :

 app.get('/', function( req, res, next ) { return res.render('index'); }); 

Соответствующее представление ( views/index.hbs ) по сути является просто формой загрузки файла:

 <div> <h2>Please upload an image.</h2> <p><em>Note: please ensure it's at least 960 x 300 pixels in size.</em></p> </div> <form method="post" action="/upload" enctype="multipart/form-data"> <div class="form-group"> <input type="file" name="file"> </div> <div class="form-group"> <input type="submit" value="Submit" class="btn btn-primary"> </div> </form> 

Прежде чем мы сможем разобраться с проблемой обнаружения лиц, нам нужно создать простой механизм загрузки файлов. Это позволит пользователям загружать изображение, которое мы изменим до разумного размера, а затем покажем ему обратно.

Вот код:

 // POST callback for the file upload form. app.post('/upload', upload.single('file'), function(req, res, next){ // Use filename generated for us, plus the appropriate extension var filename = req.file.filename + exts[req.file.mimetype] // and source and destination filepaths , src = __dirname + '/' + req.file.path , dst = __dirname + '/public/images/' + filename; async.waterfall( [ function(callback){ // Check the mimetype to ensure the uploaded file is an image if (!_.contains(['image/jpeg','image/png','image/gif'],req.file.mimetype)){ return callback(new Error( 'Invalid file - please upload an image (.jpg, .png, .gif).') ) } return callback(); }, function(callback){ // Get some information about the uploaded file easyimg.info(src).then( function(file){ // Check that the image is suitably large if ((file.width 

Все, что мы делаем здесь, это захват загруженного файла, проверка его изображения, проверка его минимального размера и, если это так, изменение его размера до 960 пикселей. Код распознавания лиц пока отсутствует. Мы придем к этому через минуту.

Я не буду вдаваться в подробности этого процесса, поскольку он не является основной темой статьи, но если вы хотите понять, что происходит, ознакомьтесь с документацией по multer и easyimage .

Далее нам нужно прочитать изображение с помощью библиотеки OpenCV . За кадром это преобразует изображение в матрицу пикселей, после чего он может запустить алгоритм обнаружения объектов.

Метод, который мы используем для этого, имеет следующую подпись:

 cv.readImage(filepath, function(err, im){ // do something with the matrix referred to by the im variable }); 

Поскольку мы используем async модуль, мы можем просто передать ему обратный вызов в качестве второго аргумента. Первый аргумент — это пункт назначения dst ; то есть результат процесса изменения размера. Таким образом, рассматриваемая функция выглядит следующим образом:

 function(callback){ //Use OpenCV to read the (resized) image cv.readImage(dst, callback); }, 

Далее нам нужно запустить функцию обнаружения признаков algorthim, которая является методом класса Matrix . Вот подпись:

 im.detectObject(classifier, options, function(err, faces){ // faces contains an array of data about any faces it's found }); 

Все в порядке, переменная faces будет содержать массив хэшей, по одному на каждую найденную грань. Каждый хеш будет содержать координаты x и y ( 0,0 — верхний левый угол изображения), а также width и height — таким образом, определяется область изображения, которую предполагается покрыть лицом.

 function(im, callback){ // Run the face detection algorithm im.detectObject(cv.FACE_CASCADE, {}, callback); } 

 <div class="alert alert-error" role="alert"> <strong>An error has occured:</strong> {{ message }} </div> <a href="/" class="btn btn-default">&larr; Go back and try again</a> 

 {{#if faces.length}} <div class="alert alert-success" role="alert"> I found <strong>{{faces.length}}</strong> face(s). </div> {{else}} <div class="alert alert-warning" role="alert"> Sorry, but I couldn't find any faces... </div> {{/if}} <div class="frame"> <img src="/images/{{ filename }}"> {{#each faces}} <a href="#" style="width: {{ width }}px; height: {{ height }}px; left: {{ x }}px; top: {{ y }}px;"></a> {{/each}} </div> <a href="/" class="btn btn-default">Go back and try another</a> 

 node index.js 

 libdc1394 error: Failed to initialize libdc1394 

 sudo ln /dev/null /dev/raw1394 

 http://192.168.10.10:8080/