Question

我有一个简单的脚本，可以在webRTC文档中找到，我试过运行它，但是似乎我缺少了一些东西

const leftVideo = document.getElementById('leftVideo');
const rightVideo = document.getElementById('rightVideo');

leftVideo.addEventListener('canplay', () => {
const stream = leftVideo.captureStream();
rightVideo.srcObject = stream;
});

我检查流捕获时收到此错误未捕获的DOMException：无法在'HTMLMediaElement'上执行'captureStream'：无法从具有跨域数据的元素捕获在HTMLVideoElement.leftVideo.addEventListener处这是我的index.html

<video id="leftVideo" playsinline controls loop muted>
    <source src="test1.webm" type="video/webm"/>
    <p>This browser does not support the video element.</p>
</video>

<video id="rightVideo" playsinline autoplay></video>

Answer 1

您可以如本链接所示设置crossOrigin 示例：

thread1 = new Thread(DoWork);

您要确保链接使用的是https

参考： https://stackoverflow.com/a/35245146/8689969

或者您可以使用访存创建可读的流，请访问以下链接的文档https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream，该链接为您提供了可帮助解决该问题的Blob网址：示例：

<video crossOrigin="anonymous" src="https://cdn.myapp.com:81/video.mp4"></video>

祝你好运...

是否可以从具有交叉原点数据的元素中捕获？

1 个答案: