Javascript下载网页

这个需求来自于批量抓取网页时,希望可以通过浏览器的js带上cookie等信息去下载页面。这样的功能也可以通过fiddler来做到,不过fiddler写脚本可能没有js方便。

下面的方法来自于这篇博客。核心就是创建一个URL对象,放在<a>标签中,并模拟click事件触发浏览器下载。

js代码:

var URL = URL || webkitURL || window;
function saveAs(blob, filename) {
    var type = blob.type;
    var force_saveable_type = 'application/octet-stream';
    if (type && type != force_saveable_type) { // 强制下载,而非在浏览器中打开
        var slice = blob.slice;
        blob = slice.call(blob, 0, blob.size, force_saveable_type);
    }

    var url = URL.createObjectURL(blob);
    var save_link = document.createElementNS('http://www.w3.org/1999/xhtml', 'a');
    save_link.href = url;
    save_link.download = filename;

    var event = document.createEvent('MouseEvents');
    event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
    save_link.dispatchEvent(event);
    URL.revokeObjectURL(url);
}

function loadXMLDoc(url, callback) {
  var xmlhttp=new XMLHttpRequest();
  xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
       callback(xmlhttp.responseText);
    }
  }
  xmlhttp.open("GET",url,true);
  xmlhttp.send();
}

function fetch(url, filename) {
    loadXMLDoc(url, function(data){
        saveAs(new Blob([data]), filename);
        // new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"});
    });
}

使用:

fetch("http://www.google.com", "google.html");

一个更完善的项目详见这里这里

文档更新时间: 2018-11-10 23:06   作者:nick