js 文件下载download

最新推荐文章于 2024-08-26 14:54:22 发布

pingmin_1001

最新推荐文章于 2024-08-26 14:54:22 发布

阅读量411

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/pinhmin/article/details/131066229

版权

该段代码展示了如何利用HTML5的download属性进行文件下载。download属性适用于非跨域环境，对于浏览器无法解析的文件类型，如.exe或.xlsx，浏览器会自动下载。但对于.txt、.png、.pdf等可解析文件，需设置Content-Type为application/octet-stream以强制下载。

摘要由CSDN通过智能技术生成

function download(file) {
    var a = document.createElement('a');
    a.style.display = 'none';
    a.setAttribute('target', '_blank');
    /*
     * download的属性是HTML5新增的属性
     * href属性的地址必须是非跨域的地址，如果引用的是第三方的网站或者说是前后端分离的项目(调用后台的接口)，这时download就会不起作用。
     * 此时，如果是下载浏览器无法解析的文件，例如.exe,.xlsx..那么浏览器会自动下载，但是如果使用浏览器可以解析的文件，比如.txt,.png,.pdf....浏览器就会采取预览模式
     * 所以，对于.txt,.png,.pdf等的预览功能我们就可以直接不设置download属性(前提是后端响应头的Content-Type: application/octet-stream，如果为application/pdf浏览器则会判断文件为 pdf ，自动执行预览的策略)
     */
    if (file) {
        var lastLen = file.lastIndexOf("/");
        var fileName = file.substring(lastLen + 1);
        fileName && a.setAttribute('download', fileName);
    };
    a.href = file;
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
}