Access information about media sources that can be used to capture audio and video from the desktop using the
navigator.mediaDevices.getUserMedia
API.
Process: Renderer
The following example shows how to capture video from a desktop window whose title is Electron
:
// In the renderer process.
const {desktopCapturer} = require('electron')
desktopCapturer.getSources({types: ['window', 'screen']}, (error, sources) => {
if (error) throw error
for (let i = 0; i < sources.length; ++i) {
if (sources[i].name === 'Electron') {
navigator.mediaDevices.getUserMedia({
audio: false,
video: {
mandatory: {
chromeMediaSource: 'desktop',
chromeMediaSourceId: sources[i].id,
minWidth: 1280,
maxWidth: 1280,
minHeight: 720,
maxHeight: 720
}
}
}, handleStream, handleError)
return
}
}
})
function handleStream (stream) {
document.querySelector('video').src = URL.createObjectURL(stream)
}
function handleError (e) {
console.log(e)
}
To capture video from a source provided by desktopCapturer
the constraints passed to navigator.mediaDevices.getUserMedia
must include chromeMediaSource: 'desktop'
, and audio: false
.
To capture both audio and video from the entire desktop the constraints passed to navigator.mediaDevices.getUserMedia
must include chromeMediaSource: 'desktop'
, for both audio
and video
, but should not include a chromeMediaSourceId
constraint.
const constraints = {
audio: {
mandatory: {
chromeMediaSource: 'desktop'
}
},
video: {
mandatory: {
chromeMediaSource: 'desktop'
}
}
}
The desktopCapturer
module has the following methods:
desktopCapturer.getSources(options, callback)
options
Object
types
String[] - An array of Strings that lists the types of desktop sources to be captured, available types are screen
and window
.thumbnailSize
Size (optional) - The size that the media source thumbnail should be scaled to. Default is 150
x 150
.callback
Function
error
Errorsources
DesktopCapturerSource[]Starts gathering information about all available desktop media sources, and calls callback(error, sources)
when finished.
sources
is an array of DesktopCapturerSource
objects, each DesktopCapturerSource
represents a screen or an individual window that can be captured.