html5 <a download=""> force &#34;save as&#34; dialogue

时间：2017-03-23 04:03:31

标签： javascript html5 

<html>
  <body>
    <a href="https://www.google.com.ua/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" download> download</a>
  </body>
</html>

Hello! Any suggestions to force save-as dialogue for image w/o .htaccess?

4 个答案:

答案 0 :(得分：3)

这是一个浏览器（chrome？）功能。

您的用户可以根据需要进行配置。

Screenshot of Chrome's settings

你甚至FileSaver.js都无法做任何事情......

答案 1 :(得分：-1)

改编自帖子： force browser to download image files on click

由于html5'download'属性仍然只适用于兼容的浏览器。 （根据@ RichardParnaby-King的answer）

您可以尝试：

var link = document.createElement('a');
link.href = 'images.jpg';
link.download = 'Download.jpg';
document.body.appendChild(link);
link.click();

（感谢@ DrowsySaturn的answer） 值得一提的是，由于它是JS，一些较旧的浏览器不支持此功能。

由于浏览器各自都有自己的处理链接的方式，因此浏览器通常会在标记上由URL指定时显示图像，而不是自动下载。这旨在通过download attribute in HTML5进行纠正，但显然有些浏览器尚未实现（有些浏览器可能永远不会实现）。

PS：首先尝试搜索您的问题，以防止重复！

答案 2 :(得分：-1)

最可靠的方法是强制它在服务器端。

为方便起见，浏览器将以特定方式自动处理特定内容。特别是，浏览器会通过内联显示来自动处理图像，这是您要避免的。

浏览器如何知道它是一个图像，而不是其他一些内容。服务器发送标题来说明。对于 png 图像，服务器发送如下内容：

Content-Type: image/png。

诀窍是让服务器也发送一个处理内容的首选方法。在您的情况下，您需要这样的标题：

Content-disposition: attachment; filename=…

这将告诉浏览器下载它。

执行此操作的简单PHP脚本将是这样的：

//  assuming png
$filename=@_GET['filename'];
$data=file_get_contents($filename);
header("Content-disposition: attachment; filename=$filename");
header('Content-type: image/png');
print $data;

答案 3 :(得分：-1)

由@Kaiido评论解决：

  

这是一个浏览器（Chrome？）功能。您的用户可以将其配置为   他希望。 i.stack.imgur.com/BvOD8.png甚至FileSaver.js都做不到   关于它的任何事情......

大多数基于chrome的浏览器（在我的情况下是Opera）默认启用此选项。

相关问题
最新问题