28

有没有人有尝试通过节点访问网络摄像头的经验?我似乎找不到任何先前的尝试。

扩展一点 - 我有一个 nodeJS 服务器正在运行,我希望能够在 Node 正在运行的同一个盒子上访问网络摄像头(所以真的,我更多地使用 node 作为客户端实现)。我想做的一些事情-从网络摄像头获取图像,或者,如果我可以将流传输到网络摄像头,然后通过管道传输到另一台服务器并流传输到其他客户端,那就太棒了;)

有谁知道如何做到这一点?

谢谢

4

5 回答 5

15

在使用网络摄像头时,我认为 Node.js 没有什么特别之处,无论您使用什么语言或服务器,这些概念通常都是相同的。所涉及的硬件和该硬件的接口应该定义您的解决方案。

最简单的情况是提供由网络摄像头附带的软件定期保存到磁盘的单个快照,或者您可以进行系统调用,调用本地进程程序以按需保存快照。然后,您可以使用定期刷新最新快照的 Node.js 提供页面。

或者,您可以使用为操作系统(DirectShowWindows Image AcquisitionIKPictureTakerV4L2等)量身定制的控制器直接与网络摄像头硬件交互,并使用 Node.js 作为传输机制创建实时视频流。

如果您的网络摄像头有一个网络接口并且已经提供了一个流服务器,那么您可能想要研究一个反向代理解决方案,例如使用 nginx 或 Apache。这是一个使用 nginx 代理由 VLC 格式化的网络摄像头流的解决方案。

这是一个创造性的解决方案,它通过获取单个帧、编码图像数据并使用 websockets 将图像数据推送到客户端页面上的画布元素来捕获视频流,使用 Node.js 作为中间服务器。

于 2012-05-31T17:16:43.787 回答
5

也可以使用 node.js 库node-webcam

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

但我想它是 fswebcam 的简单包装器。

于 2018-11-08T10:57:15.847 回答
2

可以将 OpenCV 与 Node 一起使用来访问您的相机……本文将为您提供基本概述。 https://community.risingstack.com/opencv-tutorial-computer-vision-with-node-js/

另一种方法是在 npm 存储库中按摄像头搜索,您会发现很多处理网络摄像头的模块。

于 2017-02-10T14:03:34.747 回答
1

我正在开发我自己的基于 puppeteer(chrome 无头浏览器)的库,因此它是 100% 可移植的,并且工作正常(在我的机器中为 40fps,视频大小为 480x320):https ://www.npmjs.com/package/camera -捕获。也有不同的视频流消费方式和命令行 API。非常新的项目,因此非常欢迎反馈。

于 2019-09-26T23:15:45.897 回答
-4

在 node 应用程序中访问 web 非常简单,我们只需要使用 html5 getUserMedia() 方法来做到这一点,并且扩孔部分非常容易这里是完整的代码,请 node 我正在使用 express 框架:

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

如需完整教程,请点击使用 NodeJS 访问网络摄像头并保存点击图片链接 - TrinityTuts

于 2016-01-05T10:32:09.650 回答