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
1139 0
|
6月前
|
前端开发
14_文件下载&文件流
14_文件下载&文件流
63 0
|
6月前
|
存储
如何解决网页中的pdf文件无法下载?pdf打印显示空白怎么办?
如何解决网页中的pdf文件无法下载?pdf打印显示空白怎么办?
834 0
|
6月前
|
JavaScript 测试技术
原生js实现将图片内容复制到剪贴板
原生js实现将图片内容复制到剪贴板
|
存储 前端开发 JavaScript
JavaScrip中的文件流处理
JavaScrip中的文件流处理
88 0
|
XML 存储 移动开发
前端文件下载的正确打开方式
前端涉及到的文件下载还是很多应用场景的,那么前端文件下载有多少种方式呢?每种方式有什么优缺点呢?下面就来一一介绍。
167 0
|
移动开发 安全 JavaScript
H5的新特性-使用a标签,download属性下载图片
H5的新特性-使用a标签,download属性下载图片
367 0
|
JavaScript
Vue中 实现文件流格式图片预览
Vue中 实现文件流格式图片预览
731 0
Vue中 实现文件流格式图片预览
|
Python
wxpython 从剪贴板读取文件,读取文字,读取图像
前段时间有这样一个需求,要读取用户的剪贴板的内容,然后把剪贴板的信息复制到另一个地方。例如: 1.当用户复制的是图片时,把图片复制到一个指定位置。 2.当用户复制的是txt中的一段文字时,获得复制的文字内容。 3.当用户复制的是一个文件时,获得复制的文件名和路径,然后复制到一个指定位置。
284 0