toDataURL图片下载没有扩展名

Question

我下载的图像时，一个div通过使用点击...

document.location.href = save_canvas.toDataURL("image/jpeg").replace("image/jpeg", "image/octet-stream"); 

这是工作，但该下载没有扩展名，并就被称为“下载”

图像

我已经尝试设置这样的名字......

document.location.download = "myfile.jpg"; 
document.location.href = save_canvas.toDataURL("image/jpeg").replace("image/jpeg", "image/octet-stream"); 

但它有没有影响，我在哪里去了？

Answer 1

download属性不是Location对象的一部分，因为document.location成立，仅适用于HTML定位点（A）标记（除IE外）。

根据浏览器和版本的不同，您可以尝试将画布转换为Blob对象，然后转换为File以设置文件名，并通过URL.createObjectURL()将其作为URL提供。此外，在IE中不支持toBlob()（但您可以使用polyfilltoBlob()，并使用msSaveBlob代替）。

（你也想以 “应用” 为MIME类型（例如， “应用程序/八位字节流”），以取代MIME类型的 “图像”。）

c.toBlob(function(blob) { 
 
    var file = new File([blob], "test.png", {type: "application/octet-stream"}); 
 
    document.location.href = URL.createObjectURL(file); 
 
})

A save request with PNG and filename should appear when running this code... 
 
<canvas id=c></canvas>

或者，请尝试FileSaver.js library，它处理许多特殊情况。