javascript - 什么是 Service Worker 的 URL.createObjectURL 的模拟

Question

带 list v2 , 我用 URL.createObjectURL为了从 background 返回文件至content .如何使用 list v3和服务人员？我知道XMLHttpRequest至fetch .但是什么模拟URL.createObjectURL ?

// background.js
function onContentMessage(message, sender, sendResponse) {
    if (message.action == 'requestFileGET') {
        requestFileGET(message.url, (url) => sendResponse(url));
    }
    return true;
}

function requestFileGET(url, callback) {
    let request = new XMLHttpRequest();
    request.responseType = 'blob';
    request.onreadystatechange = function () {
        if (request.readyState == 4) {
            let url = URL.createObjectURL(request.response);
            callback(url);
        }
    };
    request.open('GET', url);
    request.send();
}

// content.js
backgroundFileGET(urlCover, (cover) => {
    let url = `${HANDLER_UPLOADPIC}?kind=${kind}&sign=${sign}`;
    let formData = new FormData();
    formData.append('file', cover);
    requestFilePOST(url, formData, callback);
});

function backgroundFileGET(url, callback) {
    backgroundRequest('requestFileGET', url, (backgroungdUrl) => {
        requestFileGET(backgroungdUrl, (file) => callback(file));
    });
}

function backgroundRequest(action, url, callback) {
    chrome.runtime.sendMessage({ action: action, url: url }, (response) => callback(response));
}

Answer 1

我的解决方案使用 ID 存储数据并打开一个新选项卡，其中包含类似 download.html#ID 的页面

let videoId = '#' + new Date().valueOf();
self.DownloadedVideoData[videoId] = { data: data, filename: 
filename, mimetype:mimetype, segment:segment, action:'download' };
chrome.tabs.create({ url: "video.html" + videoId, active: false });

在页面内注册一个函数来加载和你的下载代码

chrome.runtime.sendMessage({
    action: 'GetVideoDataByID',
    VideoID: self.VideoID,
}, function (videoData) {
    if (videoData.action == 'download') self.DownloadVideo(videoData);
);

self.DownloadVideo = function (request) {
    let blob = new Blob(request.data, { type: request.mimetype }),
    downloadId;

    chrome.downloads.onChanged.addListener(function (dl) {
        if (dl.id === downloadId && dl.state && dl.state.current == 
         'complete') {
            window.close();
        }
    });

    chrome.downloads.download({
        url: URL.createObjectURL(blob),
        filename: request.filename
    }, function (id) {
        downloadId = id;
        window.close();
    });
}

现在您只需要像这样的 Backround Worker 中的 Listener

chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
     switch (request.action) {
        case 'GetVideoDataByID':
            sendResponse(self.GetVideoDataByID(request.VideoID));
            break;
        default:
            break;
     }
}