Question

我正在尝试构建一个chrome扩展程序，它可以使用chrome.desktopCapture.chooseDesktopMedia记录当前选项卡，并将记录流式传输到default_popup文件。

目前我在内容脚本中获取流的对象url，将其传递给后台脚本进行一些检查，然后再将其传递给popup.js，这是我弹出的javascript文件。当在页面的DOM上播放时，流工作并显示为视频，并且对象传递也没有问题。

但似乎objectURL无法从弹出窗口访问视频！有没有办法解决这个问题？

这是我在检查弹出窗口控制台时遇到的错误：

blob：https％3A // developer.chrome.com / 5363c96d-69ff-4e91-8d06-48f1648ad0e4无法加载资源：服务器响应状态为404（未找到）

Answer 1

我刚刚发现了如何做到这一点。

为了在chrome扩展中的脚本和标签之间传输blob网址，您必须首先发送xmlhttp请求以从其他脚本上创建的原始blob网址中获取blob。然后从当前页面上的该blob重新创建blob url。

e.g。

//originalURL is the bloburl from your content script
//in your popup script, call this
var request=new XMLHttpRequest();
request.open('GET', originalURL);
request.responseType='blob';
request.send();
request.onload=function(){
var newURL=URL.createObjectURL(request.response);
}
//newURL is the bloburl which can not be used on your popup script, you can set it as the soure of a video etc...

我希望这有助于某人！

Answer 2

感谢@jasonY提供有效的解决方案。在我的情况下，我需要将ObjectURL从后台脚本发送到内容脚本。

async function reissueObjectURL (url) {
    return new Promise((resolve, reject) => {
        var request = new XMLHttpRequest();
        request.open('GET', url);
        request.responseType = 'blob';
        request.onload = () => {
            resolve(URL.createObjectURL(request.response));
            URL.revokeObjectURL(url);
        };
        request.send();
    });
}

在Chrome扩展程序中，是否可以在弹出窗口中截屏并显示屏幕？

2 个答案: