是否可以使用 getDisplayMedia() 禁用光标记录

Question

我正在使用 MediaStream 和 MediaRecorder 录制我的浏览器窗口。

但需要禁用鼠标光标被记录，所以当我创建我的视频轨道时，我使用以下代码：

stream['input'] = await navigator.mediaDevices.getDisplayMedia({
    audio: true,
    video: {
    cursor: 'never',
    frameRate: 40,
}
});
console.log( stream['input'].getVideoTracks()[0].getSettings() );

但是 chrome、opera 和边缘控制台显示：

aspectRatio: 1.7777777777777777
cursor: "motion"
deviceId: "window:200730:1"
displaySurface: "window"
frameRate: 40
height: 1080
logicalSurface: true
resizeMode: "crop-and-scale"
width: 1920

但似乎忽略了设置，所以光标正在被记录。

我可以看到我的控制台中正在设置 frameRate 约束，但是我似乎终生无法禁用光标。

然而，firefox 不会记录光标并在控制台中显示它

frameRate: 40
​height: 924
​width: 1263

有没有人成功地使用 Chrome、Edge 和 Opera 完全禁用光标？

我什至尝试过使用

stream['input'].getVideoTracks()[0].applyConstraints( { 
video: { cursor: 'never', frameRate: 30 } 
} );

这不起作用:-(

更新： 我可以从这里的图表中看到： https://developer.mozilla.org/en-US/docs/Web/API/MediaTrackConstraints

游标约束应该只在opera上受支持。但是 getSupportedConstraints() 的输出显示游标毕竟不受支持。

谢谢

Answer 1

在本页底部，您会找到一个表格，显示浏览器对各种“MediaTrackConstraints”属性的支持。

https://developer.mozilla.org/en-US/docs/Web/API/MediaTrackSupportedConstraints

cursor 没有得到广泛支持，很遗憾。

您可以使用getSupportedConstraints() 了解运行您的代码的浏览器支持的内容。

在你的 devtools 控制台中试试这个，看看你的浏览器可以做什么，或者更有可能做什么，不能做什么。

console.log(navigator.mediaDevices.getSupportedConstraints())