Electron is a good application building platform for Desktops (Windows, Mac & Linux). It is very easy to access local PC resources like camera in a simple local HTML file.
In this main.js file we created a electron browser and load simple java script file preload.js to access camera stream and passed to html5 video element.
main.js
const {app, BrowserWindow} = require('electron'); const path = require('path'); let mainWindow; // This method will be called when Electron has done everything // initialization and ready for creating browser windows. app.on('ready', function() { // Create the browser window. mainWindow = new BrowserWindow({ width: 800, height: 600, webPreferences: { preload: path.join(__dirname, "preload.js") } }); // and load the index.html of the app. mainWindow.loadFile('index.html'); // Emitted when the window is closed. mainWindow.on('closed', function() { // Dereference the window object, usually you would store windows // in an array if your app supports multi windows, this is the time // when you should delete the corresponding element. mainWindow = null; }); }); // Quit when all windows are closed. app.on('window-all-closed', function() { if (process.platform != 'darwin') app.quit(); });
preload.js
navigator.mediaDevices.getUserMedia({video: true}) .then(function(stream) { document.getElementById('camera').srcObject = stream; }).catch(function() { alert('could not connect stream'); });
Download full source from here https://github.com/lahirutm/Electron-Camera-Access and run
npm install
to install dependencies and libraries.
then
npm start
to run the sample. Then you camera stream will display in the desktop app made using Electron.