HTML – 如何使Safari和IE下载图像而不是在新页面中打开?

前端之家收集整理的这篇文章主要介绍了HTML – 如何使Safari和IE下载图像而不是在新页面中打开?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
在Firefox和Chrome中,此链接属性“download = img.jpg”工作正常,并显示下载窗口而不是新的选项卡或页面.
<a href="img.jpg" download="img.jpg">Download Image</a>

但在Safari和IE中,这个链接给了我一个新的页面.

那么使用Safari和IE浏览器处理这个问题的简单而有效的工作流程是什么?

解决方法

你在Apache服务器上工作吗?如果是这样,您可以将其添加到.htaccess文件中:
RewriteCond %{REQUEST_FILENAME} -f
RewriteCond %{QUERY_STRING} fdl=1
RewriteRule .? - [T=application/octet-stream]

检查是否是文件
检查参数fdl = 1是否在查询字符串中
输出为八位字节流/强制下载

现在,当您希望浏览器开始下载该站点中的任何内容时,只需将参数放在url上:

<a href="img.jpg?fdl=1">Download Image</a>

要在IIS Windows服务器上执行相同的操作,请将出站规则添加到web.config:

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <rewrite>
            <outboundRules>
                <rule name="Force Download">
                    <match serverVariable="RESPONSE_Content_Disposition" pattern=".?" negate="false" />
                    <action type="Rewrite" value="application/octet-stream" replace="true" />
                    <conditions>
                        <add input="{QUERY_STRING}" pattern="fdl=1" />
                    </conditions>
                </rule>
            </outboundRules>
        </rewrite>
    </system.webServer>
</configuration>

编辑(2016年10月4日):

所有浏览器的下载属性仍然是not fully adopted.

对于基于JavaScript /浏览器的实现,您可以查看FileSaver.js,这是一个用于在不支持它的浏览器中保存功能的polyfill.但它没有完美的覆盖范围.

原文链接:https://www.f2er.com/html/232335.html

猜你在找的HTML相关文章