跨域、下载文件、a标签、download属性

6,864 阅读1分钟

< a href=" " download >下载</ a>

浏览器对于能打开的文件,会直接打开,而不是下载。添加download属性可以解决这个问题。
但是,该方法只适用于同源场景,无法下载跨域文件。

介绍一下项目背景,后端返回我文件的URL地址,我需要实现文件下载,不能出现文件打开情况。 于是开始各种搜解决方案......,如下是研究过的几个文章:

试了下图2个方案,结果有的文件可以下载,有的文件仍然是直接打开。 stackoverflow.com/questions/1… stackoverflow.com/questions/3…

image.png

image.png
于是继续找方案。。。
庆幸找到了2个文章:
blog.csdn.net/qq_43471802…
www.jianshu.com/p/477e3a4a9…
最终的解决方案是: 找后端调整接口,返回的不是文件的url,而是二进制流。然后按照上面第二篇文章末尾所说的方案,最终解决了问题。本人写这个文章,主要是分享了实现跨域下载的求知过程,花了接近一天半的时间。最终还是开放的程序员世界拯救了我。写这个文章主要是希望能帮助到苦苦求方案的你,节省开发时间。继续加油!

image.png

image.png