我们可以使用chrome.downloads.download完全下载网页吗？(谷歌Chrome扩展程序)

Question

我想从Google Chrome扩展程序中完全保存wabpage.我添加了"downloads", "<all_urls>"权限并确认以下代码将Google页面保存到google.html.

  chrome.downloads.download(
            { url: "http://www.google.com",
              filename: "google.html" },
            function (x) { console.log(x); })

但是,此代码仅保存html文件.样式表,脚本和图像不会保存.我想完全保存网页,好像我用对话框保存页面,选择Format: Webpage, Complete.

我调查了文件,但找不到办法.

所以我的问题是:如何使用谷歌浏览器的api完全从扩展程序下载网页？

Answer 1

该downloadsAPI只下载一个单一的资源.如果你想保存一个完整的网页,那么你可以先打开网页,然后用其导出为MHTML chrome.pageCapture.saveAsMHTML,创建一个blob:用于导出-URL Blob使用URL.createObjectURL和最终使用保存此URL chrome.downloads.downloadAPI.

pageCapture API需要有效的tabId.例如:

// Create new tab, wait until it is loaded and save the page
chrome.tabs.create({
    url: 'http://example.com'
}, function(tab) {
    chrome.tabs.onUpdated.addListener(function func(tabId, changeInfo) {
        if (tabId == tab.id && changeInfo.status == 'complete') {
            chrome.tabs.onUpdated.removeListener(func);
            savePage(tabId);
        }
    });
});

function savePage(tabId) {
    chrome.pageCapture.saveAsMHTML({
        tabId: tabId
    }, function(blob) {
        var url = URL.createObjectURL(blob);
        // Optional: chrome.tabs.remove(tabId); // to close the tab
        chrome.downloads.download({
            url: url,
            filename: 'whatever.mhtml'
        });
    });
}

要试用,请将前面的代码放入background.js,
添加权限manifest.json(如下所示)并重新加载扩展.然后将打开example.com,网页将保存为自包含的MHTML文件.

{
    "name": "Save full web page",
    "version": "1",
    "manifest_version": 2,
    "background": {
        "scripts": ["background.js"]
    },
    "permissions": [
        "pageCapture",
        "downloads"
    ]
}