当前位置:首页 > php > 正文内容

a标签跨域下载文件,解决download失效问题

phpmianshi1个月前 (07-02)php55

背景


a标签中download属性可以更改下载文件的文件名。但是如果是跨域的话,download属性就会失效。


解决方案一

<a onclick="downloadFile('https://img1-cdn-picsh.stock-ring.com/download/pdf/2021-6-23/pdf_16244197738344649.pdf','fileName.pdf');">下载文件</a>

<a onclick="downloadFile('https://img1-cdn-picsh.stock-ring.com/download/mp3/2021-6-23/mp3_16244197781388916.mp3','fileName.mp3');">下载文件</a>

<script>
    function downloadFile(url, fileName) {
        var x = new XMLHttpRequest();
        x.open("GET", url, true);
        x.responseType = 'blob';
        x.onload = function (e) {
            var url = window.URL.createObjectURL(x.response)
            var a = document.createElement('a');
            a.href = url;
            a.download = fileName;
            a.click();
        }
        x.send();
    }
</script>


解决方案二

当然我们也可以通过设置响应的header

Content-Disposition 

用来激活浏览器的下载,同时可以设置默认的下载的文件名。
服务端向客户端浏览器发送文件时,如果是浏览器支持的文件类型,如 TXT、JPG 等类型,会默认直接使用浏览器打开,如果需要提示用户保存,则可以通过配置 Content-Disposition 字段覆盖浏览器默认行为。常用的配置如下:
Content-Disposition:attachment;filename=FileName.txt


如果发现地址打开,无法下载或者自动保存的地址不是自己想要的默认名字时,可以考虑修改返回的header,腾讯云COS,CDN等都可以设置返回的header


参考文献:

https://cloud.tencent.com/document/product/228/41737



版权声明:本文由PHP面试资料网发布,如需转载请注明出处。
分享给朋友:

相关文章

PHP内核分析之生命周期(三)

一、概览PHP生命周期有五个阶段,分别为模块初始化阶段、请求初始化阶段、执行阶段、请求关闭阶段、模块关闭阶段。只是不同SAPI模式下,请求的情况略有不同,比如FastCGI下只经历了一次模块初始化阶段...

DAL、DAO、ORM、Active Record详解

模型 Model模型是MVC中的概念,指的是读取数据和改变数据的操作(业务逻辑)。一开始我们直接把和数据库相关的代码放在模型里(sql直接写在代码中),这样就会导致以后的维护相当麻烦。业务逻辑的修改都...

记一次tp3.2.3因fetch导致的漏洞处理过程

记一次tp3.2.3因fetch导致的漏洞处理过程

问题描述:最近发现百度收录大幅度下降,并出现大量5xx错误,有些收录页面直接跳转到其他网站,如下图:问题追查1.根据以往经验首先怀疑网站被植入或者挂马      &nbs...

php中如何合并多个pdf并压缩

背景市面上常见的pdf处理软件,大部分都是收费的,经常功能不全,有时我们需要合并多个pdf文件,有时甚至还需要压缩一下大小,我怎么能用PHP做到这一点呢?解决方案(一)利用linux命令gs、pdf2...

PHP中跨域原理以及解决方案

1.为啥出现跨域在制定Html规则时,为了安全的考虑,一个源的脚本(网页,网站)不能与另一个源的资源进行交互,所以就引发一个词叫做“同源策略”。所谓同源(即指在同一个域),就是两个页面具有相同的协议(...

php中的system方法偶尔会出现unable to fork

背景php代码中调用了system方法,执行了shell脚本,一开始运行正常,过一段时间偶尔会出现unable to fork的报错问题原因system调用会fork新的进程,因为每个用户有最大进程数...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。