html5 href 下载属性不适用于 .pdf 文件

Posted

技术标签:

【中文标题】html5 href 下载属性不适用于 .pdf 文件【英文标题】:html5 href download attribute not working with .pdf file 【发布时间】:2014-12-05 02:37:34 【问题描述】:

我希望在用户单击表格元素中的图像时下载 .pdf 文件。这就是我所拥有的:

<a href="splosion_CV.pdf"download="splosion_CV.pdf"><img src="images/downloadIcons/download_icon_violet.png" width="32" height="32" alt="Download my CV" border="0"/></a>

现在,它似乎可以点击下载,但 Chrome 显示“服务器故障”。我使用的是 Chrome 版本 38,关闭了广告屏蔽扩展。

.pdf 位于我的 public_html 文件夹中(不在任何子文件夹中),因此文件路径似乎正确...

当我尝试从 Safari 7.0.6 中的链接下载时,我收到以下消息:“禁止访问。您无权访问此服务器上的 /splosion_CV.pdf。此外,尝试时遇到 404 Not Found 错误使用 ErrorDocument 来处理请求。”

知道为什么下载属性对我不起作用吗?

【问题讨论】:

public_html 文件夹实际上可能不允许直接下载。尝试将 PDF 移动到您的 /images 目录或您知道可以直接获取文件的类似目录。您也可以在地址栏 (whatever/splosion_CV.pdf) 中输入路径,然后查看您是否确实获得了文件或 403 Forbidden 错误。 @user3120173 我将 pdf 添加到图像文件夹并更改了文件路径:<a href="images/splosion_CV.pdf"download="splosion_CV.pdf"><img src="images/downloadIcons/download_icon_violet.png" width="32" height="32" alt="Download my CV" border="0"/></a> 但 Chrome 仍然给我“失败的服务器问题”消息。当我在地址栏中输入 www.mywebsite.com/images/splosion_CV.pdf 时,出现 404 错误。但是当我在地址栏中键入 www.mywebsite.com/splosion_CV.pdf 时,Chrome 会在浏览器中显示 .pdf。 这可能是您的 Chrome 安装中的某种浏览器设置吗?还是防火墙问题?根据其他一些答案,它似乎不是您的代码。尝试使用 Chrome 开发者工具中的网络标签来查看实际发送和接收的内容 - 不一定相信屏幕上显示的消息。 @user3120173 好的!所以我尝试在打开 Chrome 的开发者工具网络选项卡的情况下加载页面,我得到的唯一错误是 .gif 图像(状态:403 禁止,类型:文本/html)但这可能是另一篇文章,一个单独的问题,我想?加载网页后,当我单击 .png 链接时,会发生同样的事情:它似乎在单击时下载了 .pdf,但随后 Chrome 显示“服务器故障问题”。我在此网页的多个位置使用 lightbox.js,这会导致“下载”属性出现问题吗?当我在本地测试网页时,我可以点击下载 .pdf。 【参考方案1】:

我在 chrome 和 fire-fox 中运行你的代码,看起来它运行良好。

代码是:

<!DOCTYPE html>
<html>
<body>
  <a href="hello.pdf" download>
    <img src="Cube.png"   border="0"/>
  </a>
</body>
</html>

注意:IE、Safari 或 Opera 12 版不支持下载属性 (及更早)

【讨论】:

我意识到 IE 不支持它;我正在 Chrome 版本 38 上对其进行测试,所以它应该按照这个工作?-> (caniuse.com/#feat=download) 但它对我不起作用。每次更改代码时,我都清除了 Chrome 的缓存。当我右键单击+“将链接另存为...”时,它甚至对我也不起作用。猜猜我必须使用php? ◔̯◔ 我的火狐版本是 - 32.0.3 Chrome - 38.0.2125.101 (64-bit)【参考方案2】:

好的,原来存在权限问题,服务器端。我联系了我的虚拟主机,他们修复了它!

【讨论】:

您的代码在 safari 上运行我使用了相同的代码但在 safari 中不工作您知道为什么这在 safari 中不工作

以上是关于html5 href 下载属性不适用于 .pdf 文件的主要内容,如果未能解决你的问题,请参考以下文章

LabelHandle 上的 canShrink 属性不适用于使用 BIRT 的 PDF 和 EXCEL 报告

html5 视频不适用于 android webview

pdf阅读器下载官方下载

从请求响应创建 PDF 不适用于 axios,但适用于本机 xhr

PHP LongBlob上传/下载不适用于图片

CSS 不适用于 DOMPDF