阅读与JavaScript中的BLOB数据的URL

问题描述 投票:2回答:1

我有一个BLOB URL,我想重新创建它作为第二BLOB URL,这样它在默认情况下下载。

var blob1 = new Blob(["Hello world!"], { type: "text/plain" });
url1 = window.URL.createObjectURL(blob1);

blob2=new Blob([url1], {type: 'application/octet-stream'});
url2 = window.URL.createObjectURL(blob2);

var a = document.createElement("a");
document.body.appendChild(a);
a.style = "display: none";
a.href = url2;
a.click();
window.URL.revokeObjectURL(url);

见的jsfiddle:

https://jsfiddle.net/7spry3jn/

但是,这只是创建了一个包含第一URL的文本文件。如何从JavaScript中的第一BLOB URL中读取数据,并给它创造了第二BLOB?

javascript url download blob
1个回答
7
投票

您可以使用download ATTR在anchor元素,强制下载和你不需要reate另一个斑点。

但是你需要支付约浏览器支持注意要,看到这里所有接受downloadattr浏览器:Can I Use

var blob1 = new Blob(["Hello world!"], { type: "text/plain" });
url = window.URL.createObjectURL(blob1);

var a = document.createElement("a");
document.body.appendChild(a);
a.style = "display: none";
a.href = url;
a.setAttribute("download","Any name");
a.click();
window.URL.revokeObjectURL(url);

并读取,你可以使用Blob这样的FileReader内容:

var myBlob = new Blob(["Hello"], {type : "text/plain"});
var myReader = new FileReader();
//handler executed once reading(blob content referenced to a variable) from blob is finished. 
myReader.addEventListener("loadend", function(e){
    document.getElementById("text").innerHTML = e.srcElement.result;//prints a string
});
//start the reading process.
myReader.readAsText(myBlob);
<p id="text"></p>
© www.soinside.com 2019 - 2024. All rights reserved.