小编典典

使用Java脚本强制下载图像

javascript

我想知道是否有任何方法可以使用Javascript / jQuery制作脚本来下载(打开下载对话框)图像,以便浏览器不仅仅显示它。


阅读 344

收藏
2020-05-01

共1个答案

小编典典

您需要为此使用服务器端脚本。

或者,您的服务器可能允许您通过配置动态更改标头。

带有mod_headers的Apache解决方案

将可下载的图像放在目录中。在此目录中,创建一个.htaccess包含以下内容的文件:

SetEnvIf Request_URI "([^/]+\.jpg)$" REQUESTED_IMAGE_BASENAME=$1
SetEnvIf Request_URI "([^/]+\.png)$" REQUESTED_IMAGE_BASENAME=$1
Header set Content-Disposition "attachment; filename=\"%{REQUESTED_IMAGE_BASENAME}e\"" env=REQUESTED_IMAGE_BASENAME

测试要求:

HEAD /test/Water%20lilies.jpg HTTP/1.1
Host: localhost

测试回应:

HTTP/1.1 200 OK
Date: Sat, 23 Jul 2011 09:03:52 GMT
Server: Apache/2.2.17 (Win32)
Last-Modified: Thu, 23 Aug 2001 14:00:00 GMT
ETag: "26000000017df3-14752-38c32e813d800"
Accept-Ranges: bytes
Content-Length: 83794
Content-Disposition: attachment; filename="Water lilies.jpg"
Content-Type: image/jpeg

HTML5解决方案

您可以在锚点上使用HTML5download属性:

<p>Example 1<br>

   <a href="http://dummyimage.com/600x400/000/fff.png" download>Download this image</a></p>



<p>Example 2<br>

   <a href="http://dummyimage.com/600x400/000/fff.png" download="alternate-filename.png"><img

       src="http://dummyimage.com/150x100/000/fff.png"></a></p>
2020-05-01