Question

我对HTML有基本的了解。我想在我的示例网站中创建下载链接，但我不知道如何创建它。如何建立链接来下载文件而不是访问它？

Answer 1

在支持HTML5的现代浏览器中，可以采用以下方法：

<a href="link/to/your/download/file" download>Download link</a>

你也可以使用它：

<a href="link/to/your/download/file" download="filename">Download link</a>

这将允许您更改实际下载的文件的名称。

Answer 2

这个答案已经过时了。我们现在具有here所述的download属性。

如果“下载链接”是指要下载的文件的链接，请使用

  <a href="http://example.com/files/myfile.pdf" target="_blank">Download</a>

target=_blank将在下载开始之前显示新的浏览器窗口。当浏览器发现资源是文件下载时，通常会关闭该窗口。

请注意，浏览器已知的文件类型（例如JPG或GIF图片）通常会在浏览器中打开。

您可以尝试发送正确的标题以强制下载，例如： here。（需要服务器端脚本或访问服务器设置。）

Answer 3

另外（或替代）已经提到的HTML5的<a download属性，
浏览器的下载到磁盘行为也可以通过以下http响应标头触发：

Content-Disposition: attachment; filename=ProposedFileName.txt;

这是HTML5之前的方法（并且仍适用于支持HTML5的浏览器）。

Answer 4

下载链接将是您要下载的资源的链接。它的构造方式与任何其他链接的构造方式相同：

<a href="path to resource.name of file">Link</a>

<a href="files/installer.exe">Link to installer</a>

Answer 5

要链接到该文件，请执行与任何其他页面链接相同的操作：

<a href="...">link text</a>

即使他们有嵌入式插件（Windows + QuickTime = ugh）也要强制下载，你可以在你的htaccess / apache2.conf中使用它：

AddType application/octet-stream EXTENSION

Answer 6

这个帖子现在可能很古老了，但这可以在我的本地文件的html5中使用。

对于pdfs：

<p><a href="file:///........example.pdf" download target="_blank">test pdf</a></p>

这应该在新窗口中打开pdf并允许你下载它（至少在firefox中）。对于任何其他文件，只需将其设为文件名即可。对于图像和音乐，您可能希望将它们存储在与您的网站相同的目录中。所以它就像

<p><a href="images/logo2.png" download>test pdf</a></p>

Answer 7

下载属性在IE中不起作用，它会忽略＆＃34;下载＆＃34;完全。如果href指向远程站点，则下载不适用于Firefox。所以Odin的例子并不适用于Firefox 41.0.2。

Answer 8

还有另一种微妙之处可以在这里提供帮助。

我想拥有既允许浏览器内播放又可以显示的链接，以及一个纯粹用于下载的链接。新的download属性很好，但并非一直有效，因为浏览器播放或显示文件的强迫性仍然很高。

但是..这是基于检查URL的文件名的扩展名的。您不想摆弄服务器的扩展名映射，因为您希望通过两种不同的方式传递相同的文件。因此，对于下载，您可以通过将文件软链接到对该扩展名映射不透明的名称，指向它，然后使用下载的重命名功能来修复该名称，从而使它蒙上阴影。

<a target="_blank" download="realname.mp3" href="realname.UNKNOWN">Download it</a>
<a target="_blank" href="realname.mp3">Play it</a>

我希望只是在末尾抛出一个虚拟查询，否则混淆扩展名会起作用，但是可悲的是，它没有。

Answer 9

HTML5中<a>标记的下载属性是新的

<a href="http://www.odin.com/form.pdf" download>Download Form</a>
或
<a href="http://www.odin.com/form.pdf" download="Form">Download Form</a>

我更喜欢第一个，对于任何扩展都是优选的。

Answer 10

您可以按照我的方式下载各种内容。尽管由于未设置“ allow-popups”权限而无法下载文件，但是在您的环境中，这将完美地运行

<div className="col-6">
                    <a  download href="https://www.w3schools.com/images/myw3schoolsimage.jpg" >Test Download </a>
                </div>

由于'X-Frame-Options'到'sameorigin'，该项目也会失败。

<a href="https://www.w3schools.com/images/myw3schoolsimage.jpg" download>
  <img src="https://www.w3schools.com/images/myw3schoolsimage.jpg" alt="W3Schools" width="104" height="142">
</a>

Answer 11

喜欢这个

<a href="www.yoursite.com/theThingYouWantToDownload">Link name</a>

因此，example.com网站上的文件名.jpg看起来像这样

<a href="www.example.com/name.jpg">Image</a>

Answer 12

我知道我迟到但这是我在搜索1小时后得到的结果

 <?php 
      $file = 'file.pdf';

    if (! file) {
        die('file not found'); //Or do something 
    } else {
       if(isset($_GET['file'])){  
        // Set headers
        header("Cache-Control: public");
        header("Content-Description: File Transfer");
        header("Content-Disposition: attachment; filename=$file");
        header("Content-Type: application/zip");
        header("Content-Transfer-Encoding: binary");
        // Read the file from disk
        readfile($file); }
    }

    ?>

对于可下载的链接，我做了这个

<a href="index.php?file=file.pdf">Download PDF</a>

如何在HTML中创建下载链接？

12 个答案: