a标签实现文件流下载

简介: a标签实现文件流下载

a标签实现文件流下载

方法1:

<a href="地址">download</a>

对于 txt , jpg , pdf 等浏览器支持直接打开的文件不会被执行下载,而是会直接打开,这时候一个新属性就要上场了–【download】

download属性不止可以实现下载,其属性值还可以规定下载时的文件名,如果不填写,会自动使用默认文件名。

<a href="地址" download="test.pdf">download</a>

很遗憾,兼容性不佳,本人实际测试结果也同上图一致。但是,虽然不兼容,但不代表完全不支持,IE 和 Safari 不会直接下载,但是会有下载提示框弹出,只是多绕了一步而已。如果不想借助后台而要实现文件下载,给a标签加download绝对是首选之策。

方法2:

const oa = document.createElement('a');
oa.href = url;
oa.setAttribute('target', '_blank');
document.body.appendChild(oa);
oa.click();
document.body.removeChild(oa);

方法3:

const parm = '\u003cscript\u003elocation.replace("' + url + '")\u003c/script\u003e';
const str = 'javascript:window.name;'
window.open(str, parm);
目录
相关文章
|
存储 JSON 前端开发
前端下载文件以及上传图片预览,顺便了解arrayBuffer和blob
前端下载文件以及上传图片预览,顺便了解arrayBuffer和blob
1153 0
|
1月前
|
前端开发 PHP
33 多文件上传及文件下载
路老师分享PHP语言知识,涵盖多文件上传和文件下载功能。多文件上传只需将表单中的文件域名称改为数组形式,文件下载则通过`header()`函数实现强制下载。详细代码示例和操作步骤,助你轻松掌握PHP核心技术。
32 1
|
7月前
|
JavaScript
vue element 导出blob后台文件流xlsx文件自动下载(且规避乱码)
vue element 导出blob后台文件流xlsx文件自动下载(且规避乱码)
|
7月前
|
前端开发
14_文件下载&文件流
14_文件下载&文件流
72 0
|
7月前
uploadify组件文件上传那些事
uploadify组件文件上传那些事
74 0
|
XML 存储 移动开发
前端文件下载的正确打开方式
前端涉及到的文件下载还是很多应用场景的,那么前端文件下载有多少种方式呢?每种方式有什么优缺点呢?下面就来一一介绍。
183 0
|
移动开发 安全 JavaScript
H5的新特性-使用a标签,download属性下载图片
H5的新特性-使用a标签,download属性下载图片
390 0
|
JSON 前端开发 数据格式
二进制流下载文件
二进制流下载文件
334 0
二进制流下载文件
|
NoSQL
OkhttpUtils单、多文件上传
OkhttpUtils单文件上传
590 0