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

Интересно, как некоторые вещи проходят полный круг. В первые дни Интернета браузеры автоматически загружали ссылки на файлы, которые не были веб-страницами, такие как изображения, файлы PDF и документы. Затем браузеры стали настолько продвинутыми, что смогли открыть практически любой файл в режиме реального времени. Это создало проблему для разработчиков. Как заставить браузер загружать файл, а не открывать его? Куча взломов и обходных путей возникли, чтобы решить проблему, но ни один не был истинным решением. Это все изменилось с HTML5, когда Скачать атрибут был представлен.

Теперь разработчики могут добавить специальный атрибут загрузки к своим тегам привязки HTML, чтобы браузеры указывали ссылку на загрузку, а не открывали целевой файл. Существует несколько различных способов использования атрибута загрузки для управления тем, как браузеры обрабатывают ваши ссылки для загрузки. Более того, все современные браузеры поддерживают атрибут загрузки, поэтому у вас не должно возникать проблем с совместимостью или необходимости откатывания.

Существует несколько различных способов обработки атрибута загрузки. Каждый из них имеет свои преимущества, и все они работают гладко в разных браузерах.

Обычный атрибут загрузки

Самый простой способ использования атрибута загрузки — просто включить его в своей основной форме в свои теги привязки. Вам не нужно указывать дополнительное имя файла или дополнительную информацию. Результат выглядит так:

Скачать сейчас!

Скачать ссылку PDF

Включая «скачать», вы говорите любому браузеру, читающему страницу, загрузить целевую ссылку вместо того, чтобы открывать ее. В этом случае браузер загрузит файл точно так же, как и с тем же именем.

Ссылка для скачивания файла следовала

Изменение имени файла

Что произойдет, если вы действительно хотите изменить имя. Есть много случаев, когда вы хотели бы сделать это. Автоматически сгенерированные имена файлов являются хорошим примером. Они обычно имеют смехотворно длинные имена со строками мусорных символов. Это не тот опыт, который вы хотите для своих посетителей. Вы можете стандартизировать вещи с помощью атрибута загрузки.

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

Скачать сейчас!

Ваши посетители будут загружать файл как your-file.pdf.

Загрузка изображения

Наряду с этим появляется упрощенный способ, позволяющий пользователям загружать изображения напрямую. Это не революционно, и вы, вероятно, можете собрать его вместе, но вы можете использовать атрибут загрузки, чтобы создать ссылку для загрузки изображения.

Ссылка для скачивания изображения

Начните с настройки изображения, как вы обычно делаете на своей странице. Это, конечно, будет изображение, которое доступно для скачивания.

мое изображение

Затем инкапсулируйте все это в тег привязки, ссылаясь на путь к изображению.


мое изображение

Наконец, добавьте атрибут загрузки к вашему тегу привязки. Вы можете изменить имя вашего изображения, если хотите.


мое изображение

Ссылка для скачивания изображения следовала

Теперь, когда посетитель нажимает на изображение, он автоматически загружает его прямо с вашего сервера. В этом нет необходимости, и это может показаться излишним для разработчика, но сколько посетителей сайта решат щелкнуть правой кнопкой мыши изображение, чтобы просмотреть или загрузить его?

Ссылка на основную публикацию