node.js - desktopCapturer 示例...如何使其适用于特定应用程序
问题描述
我正在尝试遵循本教程: https ://www.tutorialspoint.com/electron/electron_audio_and_video_capturing.htm
本教程的第一部分效果很好……我可以将 av 从我的电脑摄像头和麦克风传输到我的电子应用程序中。但现在我想做的是通过 desktopCapturer 对象从在我的 Windows 桌面上运行的特定应用程序流式传输音频和视频。
问题
我没有收到任何错误。但是电子应用程序的视频 html 标签没有显示来自 myappthatstreamsAV 的流。
代码
我将 index.html 代码更改为如下所示:(只是更改了标签内的内容)
<!DOCTYPE html>
<html>
<head>
<meta charset = "UTF-8">
<title>Audio and Video</title>
</head>
<body>
<video autoplay></video>
<script type = "text/javascript">
var desktopCapturer = require('electron').desktopCapturer;
desktopCapturer.getSources({types: ['window', 'screen']}, (error, sources) => {
if (error) throw error
desktopCapturer.getSources({types: ['window', 'screen']}, (error, sources) => {
if (error) throw error
for (let i = 0; i < sources.length; ++i) {
if (sources[i].name === 'myappthatstreamsAV') {
navigator.webkitGetUserMedia({
audio: true,
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)
}
</script>
</body>
</html>
index.js 看起来像这样:
const {app, BrowserWindow} = require('electron')
const url = require('url')
const path = require('path')
let win
// Set the path where recordings will be saved
app.setPath("userData", __dirname + "/saved_recordings")
function createWindow() {
win = new BrowserWindow({width: 800, height: 600,
webPreferences: {
nodeIntegration: true
}
})
win.loadURL(url.format({
pathname: path.join(__dirname, 'index.html'),
protocol: 'file:',
slashes: true
}))
}
app.on('ready', createWindow)
到目前为止我已经尝试过:
我添加了一些调试语句,如下所示:
<script type = "text/javascript">
var desktopCapturer = require('electron').desktopCapturer;
console.log("1")
console.log(desktopCapturer)
desktopCapturer.getSources({types: ['window', 'screen']}, (error, sources) => {
console.log("2")
if (error) throw error
for (let i = 0; i < sources.length; ++i) {
console.log((sources[i].name));
console.log("3")
基本上,它只执行前两个console.logs:
console.log("1")
console.log(desktopCapturer)
它永远不会达到 2 或 3。
解决方案
将我的代码更改为如下所示:
var desktopCapturer = require('electron').desktopCapturer;
console.log("are you here?")
console.log(desktopCapturer)
desktopCapturer.getSources({ types: ['window', 'screen'] }).then(async sources => {
for (const source of sources) {
if (source.name === 'mystreamApp') {
try {
const stream = await navigator.mediaDevices.getUserMedia({
audio: true,
video: {
mandatory: {
chromeMediaSource: 'desktop',
chromeMediaSourceId: source.id,
minWidth: 1280,
maxWidth: 1280,
minHeight: 720,
maxHeight: 720
}
}
})
handleStream(stream)
} catch (e) {
handleError(e)
}
return
}
}
})
function handleStream (stream) {
const video = document.querySelector('video')
video.srcObject = stream
video.onloadedmetadata = (e) => video.play()
}
function handleError (e) {
console.log(e)
}
现在我看到了视频流。音频仍然无法正常工作。但我会为此提出另一个问题。
推荐阅读
- java - 如何使用@Value 从 application.properties 读取然后使用该值来初始化实例变量?
- regex - 匹配地址的正则表达式:匹配具有不同结构的地址的问题
- ckeditor - CKeditor 更改语言不起作用(未将语言更改为英语)
- javascript - 从内部弹出-标签
- python - Openpyxl不修改单元格值
- python - 手动启动光线簇
- ios - 即使应用程序关闭,如何存储变量?[迅速]
- sql - 如何从具有字典列表的表中查询,仅针对某些键 (BigQuery) SQL
- c - 如何使镜头= 0?
- javascript - 尝试访问 Hardhat 中结构的 Solidity 数组时出错,操作码无效