如何使单击链接下载图像?

时间:2018-08-27 23:27:45

标签: html html5

我一直在环顾四周,但由于某些原因,我发现某些内容可用于某些链接,但是当我尝试下载图片时,它只会打开包含图片的页面

<a href="https://i.imgur.com/KBUpwNd.jpg" download="V2Map">Download</a>

我希望它能下载我链接的imgur图像,但是它只是打开了链接,有什么想法可以解决此问题吗?

3 个答案:

答案 0 :(得分:0)

download属性仅适用于相同的原始URL。 您可以编写服务器端脚本。

OR 查看this讨论以获取快速解决方法。

只需将您的URL插入downloadResource()中,如下所示:downloadResource('https://i.imgur.com/KBUpwNd.jpg');包装script标记并在浏览器上运行。

答案 1 :(得分:0)

我刚刚进行了快速测试,在这种情况下,似乎起源域很重要。

如果the image is on the same domain,则download属性可以正常工作。否则,它将打开链接。

  
      
  • 此属性仅适用于同源网址。
  •   
  • 尽管HTTP URL必须使用相同的来源,blob:URL和数据:允许使用URL,以便可以下载JavaScript生成的内容,例如在图像编辑器Web应用程序中创建的图片。
  •   
  • 如果HTTP标头Content-Disposition:提供的文件名与此属性不同,则HTTP标头的优先级高于此属性。
  •   
  • 如果将Content-Disposition:设置为内联,则Firefox会像文件名一样优先处理Content-Disposition,而Chrome会优先考虑download属性。
  •   

答案 2 :(得分:0)

根据download属性的MDN描述:

  

此属性仅适用于同源网址。

因此,它不适用于指向与您自己的域不同的URL,例如i.imgur.com

您可以在自己的服务器上使用代理脚本,例如:

<a href="/image_download.php?url=https://i.imgur.com/KBUpwNd.jpg" download="V2Map">Download</a>

然后编写执行以下操作的image_download.php脚本:

readfile($_GET['url']);

您当然应该在脚本中进行验证检查,以便它不会被第三方滥用为通用代理。 Google“ php代理”,您会发现一些预先编写的脚本。