我正在构建一个 Chrome 扩展。我想要两个并排的相同视频（类似于画中画）有点像这样。我想在单独的 iframe/video 元素中复制视频。
我不知道如何复制或克隆视频。我想要一个全新的对象（不仅仅是一个参考）。
这是视频元素的示例。
<video src="blob:https://www.netflix.com/1ca080d6-e257-414f-bef8-d34975b6325c" tabindex="-1" style="height: 100%; width: 702.4px;"></video>
我尝试了cloneNode()但没有任何运气。我收到此错误： 获取 blob...net::ERR_FILE_NOT_FOUND
我尝试手动创建视频元素并将 src 设置为 https://www.netflix.com/1ca080d6-e257-414f-bef8-d34975b6325c
我尝试了 HTMLVideoElement.requestPictureInPicture() 但它没有创建新视频。主视频窗口变黑，并打开一个迷你视频窗口。
这并不能回答我的问题，因为它没有解释如何复制以 blob 作为源的元素。 什么是 blob URL 以及为什么使用它？
这怎么办？
利用 captureStream() 我们可以获取一个玩家的输出并将其输入另一个玩家......
<!DOCTYPE html>
</style>
</head>
<body onload="V1.src=Url; RecordVideo();">
<script type="text/javascript">
var Url='SomeVideo.mp4'; // Set your video source
function RecordVideo(){
V1.onplay = function(){
let Stream=V1.captureStream(); V2.srcObject=Stream; V2.play();
};
}
</script>
<video id="V1" src="" type="video/mp4" width="320" height="240" controls></video>
<video id="V2" src="" type="video/mp4" width="320" height="240" controls></video>
</body>
</html>
我会让你弄清楚我不明白的“其他 iframe”部分。