Как сделать ссылку на скачивание файла html
Как создать ссылку для загрузки в HTML?
У меня есть основная идея HTML. Я хочу создать ссылку для загрузки на моем образце веб-сайта, но у меня нет идеи о том, как ее создать. Как сделать ссылку, чтобы загрузить файл, а не посетить его?
10 ответов
этот ответ устарел. Теперь у нас есть как рассказали здесь.
если под “ссылкой для загрузки” вы подразумеваете ссылку на файл для загрузки, используйте
на target=_blank появится новое окно браузера до начала загрузки. Это окно обычно закрывается, когда браузер обнаруживает, что ресурс является скачать файл.
обратите внимание, что типы файлов, известные браузеру (например, JPG или GIF изображения), как правило, будут открыты в браузере.
вы можете попробовать отправить правильные заголовки, чтобы заставить загрузку, как описано, например,здесь. (для этого требуются сценарии на стороне сервера или доступ к настройкам сервера.)
в современных браузерах, поддерживающих HTML5, возможно следующее:
вы также можете использовать это:
Это позволит вам изменить имя файла на самом деле загружается.
Это был способ сделать до HTML5 (и по-прежнему работает с браузерами, поддерживающими HTML5).
ссылка для загрузки будет ссылка на ресурс, который вы хотите скачать. Он построен так же, как и любая другая ссылка:
чтобы связать файл, сделайте то же самое, что и любая другая ссылка на страницу:
чтобы заставить вещи загружать, даже если у них есть встроенный плагин (Windows + QuickTime = ugh), вы можете использовать это в своем htaccess / apache2.conf:
этот поток, вероятно, уже древний, но это работает в html5 для моего локального файла.
это должно открыть pdf в новом окне и позволить вам загрузить его (по крайней мере, в firefox). Для любого другого файла просто сделайте его именем файла. Для изображений и музыки вы хотите сохранить их в том же каталоге, что и ваш сайт. Так что это будет похоже на
атрибут загрузки является новым для тег в HTML5
Я предпочитаю первый, который предпочтительнее в отношении любого расширения.
атрибут загрузки не работает в IE, он полностью игнорирует “загрузку”. Загрузка не работает в Firefox, если href указывает на удаленный сайт. Таким образом, пример Одина не работает в Firefox 41.0.2.
Итак, имя файла.jpg на сайте example.com будет выглядеть так
Я знаю, что опоздал, но это то, что я получил после 1 часа поиска
Как сделать ссылку на скачивание файла
Как правильно сделать ссылку, чтобы при клике на неё начиналось скачивание файла. Атрибут download для HTML-тега ссылки. Примеры ссылок для скачивания.
Как сделать скачивание файла с сайта.
Не редкость когда нужно бывает создать ссылку для скачивания какого то файла. При этом желательно чтобы это была прямая ссылка для скачивания, а не на внешний сайт (облако, хранилище).
Для скачивания можно передавать файлы самых различных форматов: музыка, видео, текстовые файлы, Excel, архивы и мн. другие.
Как на сайте сделать скачивание файла
Возможно вы хотите поделиться с посетителями вашего сайта каким либо файлом, при этом файл может быть самого любого формата.
Делается это при помощи ссылки на файл с использованием специального HTML тега. Про то как создавать обычные ссылки есть статья: как сделать ссылку
Ниже пойдёт речь о том как сделать ссылку для скачивания файла.
Скачивание архивов
Для файлов-архивов (форматы zip, rar и т.д.) достаточно просто указать ссылку на файл который нужно передать для скачивания. Поэтому здесь применяется обычный HTML тег ссылки:
# – вместо символа решётки в атрибуте href прописывается ссылка на файл который отдаём для скачивания;
текст ссылки – можно указать текст типа: скачать файл, скачать прайс, скачать песню, скачать видео и т.д.
Так же хочу обратить внимание, что если файл с вашего сайта указываем относительный путь к файлу /music/pesnya.mp3 , а со сторонних сайтов указываем полный путь https://inter-net.pro/music/pesnya.mp3
А вот для файлов не архивных форматов (музыка, видео, различные текстовые файлы и документы, изображения и т.д.) применяется специальный для этого тег.
HTML атрибут download
Для того, чтобы передать какой либо файл для скачивания пользователю, в HTML ссылки нужно прописать атрибут download .
Структура ссылки для скачивания в html строится следующим образом:
Вместо знака решётки # указываем ссылку на файл передающийся для скачивания.
В атрибуте download ничего указывать не нужно. Браузер поймёт что файл нужно скачивать, а не открывать.
Со всплывающей подсказкой:
В кавычках атрибута title прописываем текст всплывающей подсказки.
*Обязательно не забываем переключить редактор в режим HTML чтобы редактировать теги
Текстовая ссылка
Код:
Результат: скачать файл
Скачать через кнопку
Код:
Результат:
Есть такой инструмент как Генератор кнопок, где просто генерировать кнопки с тегом скачивания и иконками.
Кнопка с иконкой
Так же можно добавить к тексту ссылки иконочный шрифт, если он установлен у вас на сайте. При этом шрифтовую иконку можно поставить перед или после текста ссылки.
Код вставки иконки
Код:
Результат:
Скачивание файла при клике на изображение
Код:
Результат:
Со стилями CSS
Так же можно применять все свойства CSS и изменять размер шрифта, название, цвет и т.д.
Для этого добавляем атрибут style=” “
Код:
Результат:
Если вам что то не понятно или есть какие либо вопросы – не стесняйтесь и задавайте их в комментариях.
Как сделать скачивание файлов в браузере вместо их открытия на сайте!
Приветствую, Вас уважаемые читатели! Продолжаю делится с вами своим опытом решения различных (порой совсем не типичных) задач веб-разработки. И сегодня хочу вам рассказать о том как сделать прямую ссылку на скачивания файлов формата PDF. JPG, GIF, DOCX и прочих, на своем сайте. Кто не совсем понимает о чем речь немного поясню.
Дело в том что современные браузеры , при клике на ссылку, которая ведет на файл pdf (и прочие), открывают данный формат в новом окне в своем встроенном редакторе. Это достаточно удобно, когда нам нужно чтобы пользователь мог просмотреть pdf файл или изображение прямо в браузере. Но проблемы возникаю, когда нам нужно предложить пользователям скачать изображение, docx — файл или pdf. Вот в этом то случаи и начинаются «танцы с бубном», так как если мы ставим ссылку на такие форматы, браузер просто-напросто открывает их у себя в новом окне, что нас никак не устраивает. Как же решить данную проблему? А решается данная проблема несколькими способами, о которых, честно говоря я и сам узнал совсем недавно.
Буквально пару дней назад на одном из сайтов заказчика мне нужно было, чтобы пользователь при клике по ссылке мог напрямую скачать pdf файл или любой другой формат не открывая его в браузере. Нужно было что бы при клике открывалось стандартное окно для сохранения файла на компьютере.
Конечно вы можете сказать, что самый простой способ — запаковать файл в архив и давать ссылку на архив, тогда браузер будет полюбому предлагать сохранить файл на компьютере. Да все верно, но это если на это готов заказчик и если это не изображение (добавлять изображение в архив, для того чтобы пользователь мог его скачать себе на компьютер, по-моему , что-то с области дебилизма ), да и еще кучу если… Но нам поставлена конкретная задача при клике по ссылке на файл, файл должен скачиваться и точка. Ну что же давай наконец-то рассмотрим способы решения данной проблемы!
Способ №1. Добавление специальной дерективы в файл .htaccess!
Один из самых распространенных способов решения вышеописанной проблемы заключается в добавление в файл .htaccess (если вы не знаете, что это за файл гугл вам в помощь ) специальной директивы, которая запрещает открытие файлов в браузере, а заставляет их загружаться на компьютер (если говорить правильней переопределяет mime тип). Данная директива выглядит следующим образом:
После того как вы пропишите данную строку в вашем файле .htaccess браузер будет автоматически вызывать окно сохранения файла при клике на ссылку ведущую на файл с расширением .pdf
Если же вам нужно загружать изображение при клике на ссылку прописываем .htaccess следующее:
Думаю основную суть вы уловили.
Кстати, практически тоже самое, вы сможете сделать прописав директивы:
Правда справедливости ради должен признать, что вышеописанные директивы не всегда работают, здесь многое зависит от настройке сервера.
В этом случаи можно переопределить mime тип воспользовавшись следующим кодом:
Вышеописанная директива менее понятна, но судя по отзывам на форумах работает практически везде (сам я её не использовал)
Способ №2. PHP скрипт!
Бывает хостер загоняет нас в условия, когда мы особо не можем управлять настройками сервера используя .htaccess (увы и ах, это бывает очень часто) приходится выкручиваться скриптовыми решениями, а именно:
Все что вам нужно это создать на сервере пхп файл, к примеру, с именем: filesave.php и вставить туда данный скрипт. А ссылка на загружаемый файл должна выглядеть следующим образом:
Надеюсь данная строка не требует от меня пояснений. После этого все ваши файлы будут напрямую загружаться на компьютер. Что касается скрипта, то понятное дело, желательно его использовать если вы хоть немного понимаете, что там написано, иначе без кучи косяков и вопросов «Ну почему оно не работает!» не обойтись. Поэтому сами решайте использовать данный способ или тот, который описан ниже.
Способ №3. Используем новый атрибут download.
Это, как по мне, самый лучший способ заставить браузер загружать файл по прямой ссылке! Это новый атрибут ссылки, который появится только в HTML 5 . Несмотря на это данный атрибут, в принципе, нормально поддерживается всеми современными браузерами. Как использовать download? Все достаточно просто, вот вам наглядный пример:
Данный атрибут не имеет никаких параметров просто прописываете его в ссылке и всё. После этого браузер не будет переходить по ссылке, а предложит скачать файл указанный в адресе ссылки файл.
Вот, в принципе, все способы с помощью которых вы можете заставить браузер скачивать любой файл (будь-то pdf, doc, docx, png, jpg, mp3 и другие) не открывая его. На этом у меня всё, до новых встреч.
Источники:
https://askdev.ru/q/kak-sozdat-ssylku-dlya-zagruzki-v-html-9513/
https://inter-net.pro/html5/sdelat-skachivanie-fajla
https://webmox.ru/delaem-pryamuyu-ssylku-na-skachivanie-pdf-sajta.html
