在我的Chrome扩展程序中，我需要监视/获取对blob: URL的请求。当我打开Chrome开发者工具时，特别是“网络”部分。我可以看到这些请求是GET个请求。
但是，当我使用chrome.webRequest API时，在扩展程序的后台脚本中，这些blob:请求丢失了。经过一番搜索，我发现这个bug report正在请求此功能。扩展似乎没有访问blob:请求的权限，并且有一个论点，即扩展不是“ true”（网络）请求，我想这是有道理的，但它们显示为{{1 }}在开发工具中的请求。
如何获取这些GET URL的句柄。我无法在DOM结构中的任何位置找到它们，也不知道如何“即时”获取它们-我需要在资源管理器对话框窗口中选择文件（此处为图像）之后。
更新：这是我试图用来识别Facebook“照片/视频”输入元素的选定文件的当前代码的草图：
blob: 更新2：在我们开发了更多产品之后，我终于设法使其工作了。方法// Facebook is highly dynamic, so I have to wait for the input element to be loaded
this.mutationObserver = new MutationObserver(function(mutations) {
let addedNode = null;
for (let i=0; i < mutations.length; i++){
for (let j=0; j < mutations[i].addedNodes.length; j++){
addedNode = mutations[i].addedNodes[j];
let inputs = addedNode.querySelectorAll("input");
for (let inp = 0; inp < inputs.length; inp++) {
let input = inputs[inp];
if (input.getAttribute('data-testid') == 'media-sprout') {
preparePhotoVideoInput(input);
}
}
}
}
function preparePhotoVideoInput(input) {
input.addEventListener('change', handleMediaChange);
}
function handleMediaChange(e) {
console.log(e); // e.srcElement.files is always empty (same for e.target.files)
}
的最终版本如下所示：
preparePhotoVideoInput我使用一个对象function preparePhotoVideoInput(input) {
input.addEventListener('change', function(e) {
let file = this.files[0]
let reader = new FileReader();
reader.readAsDataURL(this.files[0]);
reader.onloadend = function() {
let base64data = reader.result;
attachments[file.name] = base64data;
}
}, false);
}
来收集所有上传的图像-与列表相比，它更可取，因为此事件会为每个图像触发两次，并且如果用户删除了一个发布前选择的图片。由于某些原因，使用引用的函数attachments无效。在这种情况下，handleMediaChange始终为空。但这可能只是因为我缺乏知识。