链接下载图片而不是查看图片

Posted 2023-03-05

【中文标题】链接下载图片而不是查看图片

【英文标题】：Link to download image instead of view image

【发布时间】：2011-04-08 17:49:42

【问题描述】：

我需要为网站访问者提供下载原始高分辨率图像的链接。如果我只是用 href="image.jpg" 链接到图像，浏览器会显示图像。如何让浏览器下载呢？

我正在使用 amazon S3 来处理这些图像...如果这需要在图像上设置一个特殊的标题，我相信这是可能的..但我有时也想显示这些图像。使用 S3 进行这项工作的任何提示都会很棒。

【参考方案1】：

你是对的。执行此操作需要一些标头。这些将是：

Content-type: image/png
Content-Disposition: attachment; filename="some_image.png"

我不确定 S3 是如何处理这个问题的，但如果你想显示这些图像，Content-Disposition 标题应该被省略。

编辑：通过<img src="some_image.png" alt="" /> 显示图像即使同时发送了两个标头，也可以继续工作。该图像在我的测试中显示良好。

【讨论】：

不幸的是，S3 不允许您提供具有不同标题的同一个文件，所以我需要复制所有文件。我仍然可以让用户使用 img src 查看可下载的文件吗="image.jpg"?

【参考方案2】：

您可以使用 content-disposition 标头让客户端下载图像：

Content-Disposition: attachment; filename=<file name.ext>

【讨论】：

好的，所以我可以使用 S3 添加它并通过 CloudFront 公开它。我想问题是用户将无法在没有我复制没有该标题的情况下查看完整图像。如果有该标题，我还能在 html 中内联图像吗？