desktopCapturer
Access information about media sources that can be used to capture audio and video from the desktop using the
navigator.mediaDevices.getUserMedia
API.
Prozess: Haupt
Das folgende Beispiel zeigt, wie man Video von einem Desktop Fenster mit dem Titel Electron
aufnehmen kann:
// Im Hauptprozess.
const { desktopCapturer } = require('electron')
desktopCapturer.getSources({ types: ['window', 'screen'] }).then(async sources => {
for (const source of sources) {
if (source.name === 'Electron') {
mainWindow.webContents.send('SET_SOURCE', source.id)
return
}
}
})
// In the preload script.
const { ipcRenderer } = require('electron')
ipcRenderer.on('SET_SOURCE', async (event, sourceId) => {
try {
const stream = await navigator.mediaDevices.getUserMedia({
audio: false,
video: {
mandatory: {
chromeMediaSource: 'desktop',
chromeMediaSourceId: sourceId,
minWidth: 1280,
maxWidth: 1280,
minHeight: 720,
maxHeight: 720
}
}
})
handleStream(stream)
} catch (e) {
handleError(e)
}
})
function handleStream (stream) {
const video = document.querySelector('video')
video.srcObject = stream
video.onloadedmetadata = (e) => video.play()
}
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'
}
}
}
Methoden
Das Modul desktopCapturer
verfügt über die folgenden Methoden:
desktopCapturer.getSources(options)
Rückgabe Promise<DesktopCapturerSource[]>
- Löst mit einem Array von DesktopCapturerSource-Objekte auf, wobei jede DesktopCapturerSource
einen Bildschirm oder ein einzelnes Fenster darstellt, das erfasst werden kann.
Note Capturing the screen contents requires user consent on macOS 10.15 Catalina or higher, which can detected by systemPreferences.getMediaAccessStatus
.
Vorbehalte
navigator.mediaDevices.getUserMedia
funktioniert unter macOS nicht für Audioaufnahmen aufgrund einer grundsätzlichen Einschränkung, bei der Apps, die auf das Audiosystem zugreifen wollen, eine signierte Kernel-Erweiterung benötigen. Chromium, und damit auch Electron, bieten dies nicht an.
Es ist möglich, diese Einschränkung zu umgehen, indem Sie das Systemaudio mit einer anderen macOS-App wie Soundflower aufnehmen und durch ein virtuelles Audioeingabegerät leiten. Dieses virtuellen Geräte können dann mit navigator.mediaDevices.getUserMedia
abgefragt werden.