从Javascript中的BLOB URL读取数据

Question

我有一个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/

但这只是创建一个文本文件containint第一URL。我如何从Javascript中的第一个BLOB URL读取数据并提供它来创建第二个BLOB？

Answer 1

您可以使用 attr anchor元素，强制下载并且不需要reate另一个blob。

但你需要支付约浏览器支持注意要，看到这里所有接受download ATTR浏览器：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>