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

Оглавление:

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

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

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

Image
Image

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

Простой атрибут загрузки

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

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

Image
Image

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

Image
Image

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

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

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

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

Ваши посетители будут скачивать файл как your-file.pdf.

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

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

Image
Image

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

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

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


Image
Image

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

Рекомендуемые: