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

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

phpmianshi3个月前 (07-02)php201

背景


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面试资料网发布,如需转载请注明出处。
分享给朋友:

相关文章

PHP7内存优化原理(八)

PHP7内存优化原理(八)

这里面其中的一些主要改变是性能提高的关键,主要有以下内容。1.zval使用栈内存在zend引擎和扩展中,经常要创建php变量,其底层就是一个zval指针,之前的php版本都是通过MAKE_STD_ZV...

laravel中设置数据库读写分离后强制使用主库查询

背景在项目比较火爆,QPS比较高时,可以设置读写分离来扩容数据库,减少数据库的压力,但是有些业务可能对数据一致性要求比较高,比如支付。当支付成功时,再去查询订单状态时,如果查询走的从库,如果出现主从延...

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

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

lumen项目集成laravelS后sentry无法上报的问题

背景公司项目严重依赖lumen系列,代码众多,重构困难,虽然访问量变大,性能问题越来越严重,急需要提升性能,于是找到了这个项目laravelS github : https://github.com/...

PHP中max_execution_time设置不生效

问题描述:max_execution_time设置了1秒,但是发现超过3秒的脚本还是跑。于是深入研究下max_execution_time不生效的原因。官网描述:https://www.php.net...

php-fpm进程数优化看这一篇就够了

php-fpm进程数优化看这一篇就够了

概念CGI:是 Web Server 与 Web Application 之间数据交换的一种协议。CGI(Common Gateway Interface)全称是“通用网关接口”,WEB 服务器与PH...

发表评论

访客

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