desktopCapturer
Accède aux informations des sources de médias pouvant être utilisées pour capturer l'audio et la vidéo à partir du bureau en utilisant l'API
navigator.mediaDevices.getUserMedia
.
Processus : Main
L'exemple suivant montre comment faire pour capturer la vidéo à partir d'une fenêtre dont le titre est Electron
:
// Dans le processus main.
const { BrowserWindow, desktopCapturer } = require('electron')
const mainWindow = new BrowserWindow()
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
}
}
})
// Dans le script de préchargement.
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)
}
Pour capturer une vidéo à partir d’une source fournie par desktopCapturer
les constraints
transmises à navigator.mediaDevices.getUserMedia
doivent inclure chromeMediaSource: 'desktop'
et audio: false
.
Pour capturer à la fois l’audio et la vidéo à partir du bureau, les constraints
" transmises à navigator.mediaDevices.getUserMedia
doivent inclure chromeMediaSource: 'desktop'
, pour audio
et video
, mais ne doivent pas inclure de chromeMediaSourceId
.
const constraints = {
audio: {
mandatory: {
chromeMediaSource: 'desktop'
}
},
video: {
mandatory: {
chromeMediaSource: 'desktop'
}
}
}
Méthodes
Le module desktopCapturer
dispose des méthodes suivantes :
desktopCapturer.getSources(options)
- Objet
options
types
string[] - un tableau de string qui répertorie les types de sources devant être capturées, les types disponibles étantscreen
etwindow
.thumbnailSize
Size (facultatif) - La taille de la miniature de la source de média doit être redimensionnée. La valeur par défaut est150
x150
. Définissez la largeur ou la hauteur à 0 lorsque vous n'avez pas besoin de les vignettes. Cela permettra de gagner le temps de traitement nécessaire pour capturer le contenu de chaque fenêtre et écran.fetchWindowIcons
boolean (facultatif) - Définir à true pour activer la récupération des icônes de fenêtre. La valeur par défaut est faux. Lorsque false la propriété appIcon des sources retourne null. Même si une source a l'écran de type.
Retourne Promise<DesktopCapturerSource[]>
- Résout avec un tableau de DesktopCapturerSource, chaque DesktopCapturerSource
représente un écran ou une fenêtre individuelle qui peut être capturée.
Note La capture du contenu de l’écran nécessite le consentement de l’utilisateur sur macOS 10.15 Catalina ou version ultérieure, pouvant être détecté par systemPreferences.getMediaAccessStatus
.
Avertissements
navigator.mediaDevices. etUserMedia
ne fonctionne pas sur macOS pour la capture audio en raison d'une limitation fondamentale par laquelle les applications qui veulent accéder à l'audio du système nécessitent une extension du noyau signée. Chromium, et par extension Electron, ne la fournissent pas.
Il est possible de contourner cette limitation en capturant le système audio avec une autre application macOS comme Soundflower et en le passant par un périphérique d'entrée audio virtuel. Ce périphérique virtuel peut ensuite être interrogé avec navigator.mediaDevices.getUserMedia
.