Question

我正在使用电子构建一个屏幕录像机应用程序，通过 youtube 上的 fireship 复制模型。但是写代码的时候，好像不能开始录制。我已经尝试了所有我知道的但承诺似乎没有解决。我的异步函数是否写错了。请让我知道如何修复此代码。弹出此消息。这是我的 HTML、render.js 和 index.js。

HTML：

<link rel="stylesheet" href="index.css" />
<script defer src="render.js"></script>
</head>
<body>
 <h1>Electron Screen Recorder</h1>
<video id="video"></video>
<button id="startBtn" class="button is-primary">Start</button>
<button id="stopBtn" class="button is-warning">Stop</button>

<hr />
<button id="videoSelectBtn" class="button is-text">
  Choose a video source
</button>

Index.js：

 const createWindow = () => {
// Create the browser window.
const mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
  nodeIntegration: true,
  contextIsolation: false,
  enableRemoteModule: true,
},
});

// and load the index.html of the app.
mainWindow.loadFile(path.join(__dirname, "index.html"));

// Open the DevTools.
mainWindow.webContents.openDevTools();
};

最后是 render.js：

let mediaRecorder; //MediaRecorder instance to capture footage
const recorderChunks = [];

async function selectSource(source) {
videoSelectBtn.innerText = source.name;
const constraints = {
audio: false,
video: {
  mandatory: {
    chromeMediaSource: "desktop",
    chromeMediaSourceId: source.id,
  },
 },
};

//Create a stream
const stream = await navigator.mediaDevices.getUserMedia(constraints);

//Preview the source in a video element
videoElement.srcObject = stream;
videoElement.play();

//Create the Media Recorder
const options = { mimeType: "video/webm; codecs=vp9" };
mediaRecorder = new MediaRecorder(stream, options);

//Register Event Handlers
mediaRecorder.ondataavailable = handleDataAvailable;
mediaRecorder.start();
mediaRecorder.onstop = handleStop;
}

//Captures all recorder chunks
function handleDataAvailable(e) {
console.log("video data available");
recorderChunks.push(e.data);
}

未捕获（承诺）DOMException：无法启动视频源

0 个答案: