Подтвердить что ты не робот

Доступ к WebCam с помощью NodeJS

Есть ли у кого-нибудь опыт попыток доступа к веб-камере через node? Кажется, я не могу найти никаких предварительных попыток.

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

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

Спасибо

4b9b3361

Ответ 1

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

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

В качестве альтернативы вы можете напрямую взаимодействовать с оборудованием веб-камеры с помощью контроллера, адаптированного к операционной системе (DirectShow, Приобретение образа Windows, IKPictureTaker, V4L2 и т.д.) и создайте Вот решение, где nginx используется для проксирования потока веб-камеры, отформатированного VLC.

Это креативное решение, которое захватывает видеопоток, принимая отдельные кадры, кодируя данные изображения и используя веб-дескрипторы для перемещения данных изображения в элемент холста на странице клиента, используя Node.js в качестве промежуточного сервера.

Ответ 2

Также можно использовать библиотеку node.js node-webcam

Webcam.capture( "test_picture", function( err, data ) {} );

Но я полагаю, что это простая оболочка fswebcam.

Ответ 3

Я еще не погрузился в это, но вы могли бы использовать 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 и С#, чтобы разговаривать с камерой, а затем использовать edge.js для создания вызовов .Net.

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

Ответ 4

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

Другим способом является поиск по камере в репозитории npm, вы найдете множество модулей, которые обрабатывают веб-камеры.

Ответ 5

Я работаю над своей собственной библиотекой, основанной на puppeteer (Chrome Headless Browser), поэтому она на 100% портативна и работает приемлемо хорошо (40 кадров в секунду на моей машине для видео размером 480x320): https://www.npmjs.com/package/camera-capture. Имеет различные способы потребления видеопотока и API командной строки. Очень новый проект, поэтому отзывы приветствуются.

Ответ 6

доступ к веб-сайту в приложении node очень прост, нам просто нужно использовать метод html5 getUserMedia(), чтобы сделать это, и расширение части очень просто, вот полный код, пожалуйста, node Я использую экспресс-фреймворк:

Шаг 1. Мой файл layout.jade, в котором я просматриваю веб-камеру

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'}));
        }
    });
});

Для получения полного учебного пособия перейдите по ссылке Доступ к WebCam с помощью NodeJS и сохраните изображение клика - TrinityTuts