Как я могу создать ссылку для скачивания в HTML?

В современных браузерах, поддерживающих HTML5, возможно следующее:

   Ссылка для скачивания   

Вы также можете использовать это:

   Ссылка для загрузки   

Это позволит вам изменить имя фактически загружаемого файла.

• 1
  Я использовал тот же код для загрузки файла PFD и Я тестировал во всех браузерах, все они поддерживаются, но в сафари этот код не работает сафари вместо загрузки файла PDF, открытого в новой вкладке. — Рениш Хант, 23 фев. 2015, в 8:14
• 7
  caniuse.com/#search=download%20attribute Работает в Chrome, Edge, Firefox, Opera и последних версиях браузеров Android 4.4+, но не в Internet Explorer и Safari.. — Барт Веркойен 01 апр. В 1:17
• Как мне это сделать, если я создаю ссылку динамически при нажатии кнопки? — Nongthonbam Tonthoi 10 марта 2017, в 17:51
• 1
  @NongthonbamTonthoi нельзя использовать javascript для динамического присвоения href тегу a — akshay kishore 3 апр. ’19 в 12:17
• 5
  Это не обязательно сработает, так как это ограничено URL-адресами того же происхождения. — Натан 01 июн.2020, в 20:44

В дополнение (или вместо) к уже упомянутому атрибуту HTML5

браузера em> загрузка на диск также может быть вызвана следующим заголовком HTTP-ответа:

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

Так было до HTML5 (и все еще работает с браузерами, поддерживающими HTML5).

• 5
  Но для этого нужна реализация на стороне сервера, верно? — Ломбас, 25 ноя. 2015, в 16:01
• @Lombas да, только сервер может устанавливать заголовки ответа http. — Myobis, 26 ноя. 2015, в 8:36
• Это полный ответ? Вам также необходимо отправить заголовок Content Type и прочитать файл для принудительной загрузки. Может, захочется и то на ваш ответ. Полный ответ здесь: stackoverflow.com/a/1465631/2757916. — Говинд Рай, 25 сен 2016, в 07:10
• это идеально подходит для реализации на стороне сервера, точно также тип содержимого. он хорошо поддерживается по сравнению с атрибутом download — william.eyidi 22 июня 2017 г., 15:43

Ссылка для загрузки будет ссылкой на ресурс, который вы хотите загрузить. Он построен так же, как и любая другая ссылка:

   Link   Ссылка на установщик   

Чтобы создать ссылку на файл, сделайте то же, что и для любой другой ссылки на страницу:

   текст ссылки   

Чтобы заставить объекты загружаться, даже если у них есть встроенный плагин (Windows + QuickTime = ugh), вы можете использовать его в своем htaccess/apache2 .conf:

  AddType application/octet-stream EXTENSION  

• Спасибо! это намного проще и распространяется на весь сервер! : D Я нашел эту ссылку, которая уточняет немного больше. Спасибо. htaccess-guide.com/adding-mime-types — Джо Д.Ф. 27 апр. 2014 г., в 1:36
• Это заставит загружать все файлы этого типа только. Хорошо, если вы этого хотите, но может вызвать припадки, если вы забудете и захотите, чтобы другой файл этого типа отображался в браузере вместо загрузки. — TecBrat 21 сен. ’15 в 18:08

Вероятно, эта ветка уже устарела, но она работает в html5 для моего локального файла.

Для файлов PDF:

Это должно открыть PDF-файл в новых окнах и позволить вам загрузить его (по крайней мере, в firefox) . Для любого другого файла просто укажите имя файла. Однако изображения и музыку лучше хранить в том же каталоге, что и ваш сайт. Это будет похоже на

 
  test pdf  
   

Есть еще одна тонкость, которая может помочь Вот.

Я хочу иметь ссылки, которые позволяют воспроизводить и отображать в браузере, а также одну для простой загрузки. Новый атрибут загрузки хорош, но не работает постоянно, потому что принуждение браузера к воспроизведению или отображению файла по-прежнему очень сильное.

НО.. это основано на проверке расширения в имени файла URL! Вы не хотите возиться с отображением расширений сервера, потому что вы хотите доставить один и тот же файл двумя разными способами. Таким образом, для загрузки вы можете обмануть его, соединив файл с именем, непрозрачным для этого сопоставления расширения, указав на него, а затем используя функцию переименования загрузки, чтобы исправить имя.

   Загрузить   Воспроизвести  

Я надеялся, что просто бросит фиктивный запрос в конце или иным образом запутает расширение, но, к сожалению, это не так.

Атрибут загрузки является новым для Тег в HTML5

Загрузить форму
или
Загрузить форму

Я предпочитаю первую, она предпочтительнее по сравнению с любым расширением.

Вы можете скачивать разными способами, как вы можете следовать моему пути. Хотя файлы могут не загружаться из-за того, что разрешение ‘allow-popups’ не установлено, но в вашей среде это будет работать отлично

  
  Тестовая загрузка  
  

еще один, этот также не удастся из-за ‘X-Frame-Options’ на ‘sameorigin’.

Вот так

   Название ссылки   

Таким образом, файл name.jpg на сайте example.com будет выглядеть следующим образом:

   Изображение   

• Проблема с последним в том, что он открываться в браузере, не предлагаться для скачивания и сохранения. — Пекка, 8 мая 2010 г., 10:53
• 9
  Не будет работать; браузер будет рассматривать его как относительную ссылку на ./www.example.com/name.jpg — вы должны использовать http:// для абсолютных ссылок с указанный домен. — Делан Азабани, 8 мая 2010, 10:54