如何通过JavaScript设置content-disposition = attachment
?
基本上,我想在页面加载后通过JavaScript使用Firefox强制执行"另存为"操作。
我该如何做到这一点?
如何通过JavaScript设置content-disposition = attachment
?
基本上,我想在页面加载后通过JavaScript使用Firefox强制执行"另存为"操作。
我该如何做到这一点?
仅限HTML:使用download
属性。
<a download href="http://upload.wikimedia.org/wikipedia/commons/b/bb/Wikipedia_wordmark.svg">Download</a>
仅使用JavaScript:您可以使用此代码保存任何文件:
function saveAs(uri) {
var link = document.createElement('a');
if (typeof link.download === 'string') {
link.href = uri;
link.setAttribute('download', true);
//Firefox requires the link to be in the body
document.body.appendChild(link);
//simulate click
link.click();
//remove the link when done
document.body.removeChild(link);
} else {
window.open(uri);
}
}
var file = 'http://upload.wikimedia.org/wikipedia/commons/b/bb/Wikipedia_wordmark.svg';
saveAs(file);
link.setAttribute('download','');
来避免提供下载文件的建议名称? - Speed8ump1.使用HTML5中的锚点"download"属性
<a href='abc.pdf' download>Click Here</a>
const link = document.createElement('a');
link.href = '/xyz/abc.pdf';
link.download = "file.pdf";
link.dispatchEvent(new MouseEvent('click'));
为了解决这个问题,可以使用第二个注释中引用的blob对象,并借助fetch js API。
url = 'https://aws.something/abc.pdf';
fetch(url, {
method: 'GET',
}).then(function(resp) {
return resp.blob();
}).then(function(blob) {
const newBlob = new Blob([blob], { type: "application/pdf", charset: "UTF-8" })
// IE doesn't allow using a blob object directly as link href
// instead it is necessary to use msSaveOrOpenBlob
if (window.navigator && window.navigator.msSaveOrOpenBlob) {
window.navigator.msSaveOrOpenBlob(newBlob);
return;
}
const data = window.URL.createObjectURL(newBlob);
const link = document.createElement('a');
link.dataType = "json";
link.href = data;
link.download = "file.pdf";
link.dispatchEvent(new MouseEvent('click'));
setTimeout(function () {
// For Firefox it is necessary to delay revoking the ObjectURL
window.URL.revokeObjectURL(data), 60
});
});
另一个选择是,如果您可以控制服务器端响应头,则这可能是最佳选择。
在常规的HTTP响应中,Content-Disposition 响应头是一个指示内容是否预期在浏览器中内联显示(即作为Web页面或Web页面的一部分),或作为附件下载并保存在本地的头部。 例如:
Content-Disposition: attachment
Content-Disposition: attachment; filename="filename.jpg"
content-disposition : attachment
content-disposition
,但Chrome仍然会在PDF浏览器中打开它,而不是提示保存文件。除此之外,我还能做些什么来防止Chrome自动打开它吗? - zhuhang.jasper