2012-05-30 3 views
19

Есть ли у кого-нибудь опыт в попытке получить доступ к веб-камере через узел? По-моему, я не могу найти никаких предварительных попыток.Доступ к веб-камере с помощью NodeJS

Чтобы развернуть бит - у меня запущен сервер nodeJS, и я хочу иметь доступ к веб-камере в том же поле, в котором запущен Node (так что я больше использую узел в качестве клиентской реализации). Некоторые вещи, которые я хотел сделать - получить изображение с веб-камеры, или, было бы здорово, если бы я мог получить поток к веб-камере, который я подключаю к другому серверу и передаю другим клиентам;)

Кто-нибудь знает как это можно сделать?

Благодаря

+1

какая у вас система? если это Linux, попробуйте взглянуть на пример захвата V4L (их много, например http://v4l2spec.bytesex.org/spec/capture-example.html) и создать простой один пользовательский tcp-сервер в C и мультиплексировать/распространять данные/соединения на узле, подключаясь от узла к нему. Другой вариант - использовать телефонную камеру, доступную через wifi. –

+0

Предпочтительно, система - это Windows. Кроме того, ваше предложение на самом деле довольно сложное и займет немного времени, чтобы реализовать, надеялся на что-то более простое :) – Steve

+0

с веб-камерой с сетевым телефоном это действительно просто и os-agnostic –

ответ

15

Я не думаю, что есть что-либо конкретное для Node.js, когда речь идет о работе с веб-камер, понятия не в основном те же, независимо от того, на каком языке или сервер вы используете. Используемое оборудование и интерфейсы к этому оборудованию должны определять ваше решение.

Простейший случай будет служить отдельные снимки, которые периодически сохраняются на диске веб-камера включала в себя программное обеспечение, или вы можете сделать a system call, который вызывает local process или program, чтобы сохранить снимок по требованию. Затем вы можете обслуживать страницу с помощью Node.js, которая периодически обновляет последний моментальный снимок.

В качестве альтернативы, можно непосредственно взаимодействовать с аппаратными средствами веб-камеры с помощью контроллера с учетом операционной системы (DirectShow, Windows Image Acquisition, IKPictureTaker, V4L2 и т.д.) и создать live video stream с помощью Node.js в качестве транспортного механизма.

Если ваша веб-камера имеет сетевой интерфейс и уже предлагает потоковый сервер, возможно, вы захотите посмотреть обратное прокси-решение, используя, например, nginx или Apache. Here is a solution где nginx используется для проксирования потока веб-камеры, отформатированного VLC.

Here is a creative solution that captures a video stream by taking individual frames, encoding the image data, and using websockets to push the image data to a canvas element on a client page, используя Node.js в качестве промежуточного сервера.

+1

Последняя ссылка мертва. .. – hakan

1

Я еще не нырнул в это, но вы могли бы использовать Python для этого с OpenCV.

Тогда вы можете использовать node-python для вызова python из Node.

http://opencv-python-tutroals.readthedocs.org/en/latest/py_tutorials/py_gui/py_video_display/py_video_display.html

https://www.npmjs.com/package/node-python

Необязательно, если все работает на Windows, вы можете использовать .Net и C#, чтобы поговорить с камеры, а затем использовать edge.js сделать .Net звонки.

Edge.Js поддерживает linux теперь через Mono, вам просто нужно запустить Linux-дистрибутив, в котором есть моно-пакет, или создать моно.

-4

доступ к вебу в приложении узла очень прост, мы просто нужно использовать метод html5 GetUserMedia(), чтобы сделать это и рассверливанию части очень легко здесь полный код пожалуйста узлом я использую экспресс структуру:

Шаг 1 . Мой файл layout.jade, в котором я доступ к Web Cam

extends layout 
block content 
    div(class="container" id="Cool" ng-app="mainApp" ng-controller="formController") 
    h2.blue.red#header("property"="pValue") Capture your image from webcam 
    div.row 
    div.col-md-6 
     video#video(autoplay='') 
    div.col-md-6 
     canvas#canvas(width='640', height='480') 
    div 
     button#snap Capture 
     button#new New 
     button(id="upload" ng-click="uploadImage()") Upload 


    script(type="text/javascript"). 
    // Put event listeners into place 
     window.addEventListener("DOMContentLoaded", function() { 
     // Grab elements, create settings, etc. 
     var canvas = document.getElementById("canvas"), 
     context = canvas.getContext("2d"), 
     video = document.getElementById("video"), 
     videoObj = { "video": true }, 
     errBack = function(error) { 
     console.log("Video capture error: ", error.code); 
     }; 
     // Put video listeners into place 
     if(navigator.getUserMedia) { // Standard 
     navigator.getUserMedia(videoObj, function(stream) { 
     video.src = stream; 
     video.play(); 
     }, errBack); 
     } else if(navigator.webkitGetUserMedia) { // WebKit-prefixed 
     navigator.webkitGetUserMedia(videoObj, function(stream){ 
     video.src = window.URL.createObjectURL(stream); 
     video.play(); 
     }, errBack); 
     } else if(navigator.mozGetUserMedia) { // WebKit-prefixed 
     navigator.mozGetUserMedia(videoObj, function(stream){ 
     video.src = window.URL.createObjectURL(stream); 
     video.play(); 
     }, errBack); 
     } 
     // Trigger photo take 
     document.getElementById("snap").addEventListener("click", function() { 
     context.drawImage(video, 0, 0, 640, 480); 
     // Littel effects 
     //$('#video').fadeOut('slow'); 
     $('#canvas').fadeIn('slow'); 
     //$('#snap').hide(); 
     //$('#new').show(); 
     // Allso show upload button 
     //$('#upload').show(); 
     }); 
     // Capture New Photo 
     document.getElementById("new").addEventListener("click", function() { 
     //$('#video').fadeIn('slow'); 
     //$('#canvas').fadeOut('slow'); 
     //$('#snap').show(); 
     //$('#new').hide(); 
     }); 
     // Upload image to sever 
     document.getElementById("upload").addEventListener("click", function(){ 
     var dataUrl = canvas.toDataURL(); 
     console.log(dataUrl); 

     }); 
     }, false); 
    var mainApp = angular.module("mainApp", []); 
    mainApp.controller("formController", function($scope, $http) { 
     $scope.uploadImage = function() { 
     var request = $http({ 
      method: "post", 
      url: "/captureImage", 
      data: { 
       base64: document.getElementById("canvas").toDataURL() 
      }, 
      headers: { 'Content-Type': 'application/json' } 
      }); 
     request.success(function (data) { 
      console.log(data); 
     }); 
     request.error(function(serverResponse, status, headers, config) { 
      alert("failure"); 
     }); 
     }; 
    }); 

Шаг 2. мои маршруты файл, в котором я вручаю или сохранить свой закачанный файл

router.get('/captureImage', function(req, res, next) { 
    res.render('captureImage', { title: 'Capture Image and upload' }); 
}); 

router.post('/captureImage', function(req, res, next) { 
    //console.log("FormData "+ req.body.base64); 
    var base64Data = req.body.base64.replace(/^data:image\/png;base64,/, ""); 
    fs.writeFile("uploads/out.png", base64Data, 'base64', function(err) { 
     if(err){ 
      console.log(err); 
      }else{ 
      res.send(JSON.stringify({'status': 1, 'msg': 'Image Uploaded'})); 
     } 
    }); 
}); 

Для полного учебника, пожалуйста, перейдите по ссылке Accessing WebCam with NodeJS and save click image - TrinityTuts

+3

Я не думаю, что вопрос о том, «как получить доступ к веб-камере от углового js с помощью браузера» –

+0

Я согласен с @ManasviSareen, вы отвечаете на другой вопрос. –

1

Можно использовать OpenCV с узлом доступа к камере ... эта статья даст вам базовый обзор. https://community.risingstack.com/opencv-tutorial-computer-vision-with-node-js/

Другой способ заключается в поиске по камеры на хранилище НПМ, вы найдете множество модулей, которые имеют дело с веб-камер.