Katcerina.ru

Деньги в сети
0 просмотров
Рейтинг статьи
1 звезда2 звезды3 звезды4 звезды5 звезд
Загрузка...

Как загрузить файлы на сайт

Загрузка файлов

Для того чтобы можно было загружать на сервер один или несколько файлов, в форме применяется специальное поле. В браузерах Firefox, IE и Opera такой элемент отображается как текстовое поле, рядом с которым располагается кнопка с надписью «Обзор. » (рис. 1). В Safari и Chrome доступна только кнопка «Выберите файл» (рис. 2).

Рис. 1. Вид поля для загрузки файла в Firefox

Рис. 2. Загрузка файлов в Chrome

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

Синтаксис поля для отправки файла следующий.

Атрибуты перечислены в табл. 1.

Табл. 1. Атрибуты поля для отправки файла

АтрибутОписание
acceptУстанавливает фильтр на типы файлов, которые вы можете отправить через поле загрузки файлов.
sizeШирина текстового поля, которое определяется числом символов моноширинного шрифта.
multipleПозволяет выбирать и загружать сразу несколько файлов.
nameИмя поля, используется для его идентификации обработчиком формы.

Прежде, чем использовать данное поле, в форме необходимо сделать следующее:

  1. задать метод отправки данных POST ( method=»post» );
  2. установить у атрибута enctype значение multipart/form-data .

Форма для загрузки файла продемонстрирована в примере 1.

Пример 1. Создание поля для отправки файла

HTML5 IE Cr Op Sa Fx

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

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

Если атрибут accept не указывать, тогда добавляются и загружаются файлы любого типа. Наличие accept позволяет ограничить выбор файла, что особенно важно, когда требуется загрузить только изображение или видео. В качестве значения выступает MIME-тип, несколько значений разделяются между собой запятой. Также можно использовать следующие ключевые слова:

  • audio/* — выбор музыкальных файлов любого типа;
  • image/* — графические файлы;
  • video/* — видеофайлы.
Читать еще:  Бесплатный одностраничный сайт для продаж

В табл. 2 показаны некоторые допустимые значения атрибута accept .

Табл. 2. Типы файлов

ЗначениеОписание
image/jpegТолько файлы в формате JPEG.
image/jpeg,image/pngТолько файлы в формате JPEG и PNG.
image/*Любые графические файлы.
image/*,video/*Любые графические и видеофайлы.

Использование дополнительных атрибутов показано в примере 2.

Пример 2. Загрузка фотографий

HTML5 IE 10+ Cr Op Sa Fx

Не все браузеры поддерживают новые атрибуты. IE полностью игнорирует multiple и accept , Safari не поддерживает accept , а Firefox не работает с MIME-типом, только с ключевыми словами. Поэтому в примере выше специально для Firefox установлено значение image/*,image/jpeg . Также учтите странную ошибку в Опере, она не допускает пробелы после запятой внутри accept .

Результат примера показан на рис. 3. Обратите внимание, что из-за наличия multiple несколько изменился вид поля.

Как загрузить файлы для скачивания на свой хостинг и получить ссылку?

Привет! В этой емкой инструкции поделюсь, как загрузить файлы для скачивания на свой хостинг – например, материалы в архиве или отдельно pdf-документы, и поделиться ссылкой на скачивание.

Это как альтернатива облачному хранилищу, когда вы можете давать ссылку на скачивание не с облака Яндекс, Гугл и т.п., а напрямую с вашего хостинга. Но минус тоже есть – если размещать тяжеловесные файлы от 500 мегабайт/1 гигабайт и таких файлов у вас много, то быстро можно исчерпать место на хостинге, и придется покупать более дорогие тарифы. Для небольших весом архивов, pdf-ок обычного хостинга с дисковым пространством 5-10 гигабайт будет более чем достаточно.

Итак, давайте на примере разберем, как происходит процесс загрузки файлов в архиве или отдельных pdf-документов на хостинг, как берется ссылка на эти файлы и происходит скачивание.

Вы можете посмотреть мой видеоурок ниже:

Загружать файлы вы можете в корневую папку вашего существующего сайта, например, где установлен Вордпресс – мешать работе сайта они никак не будут. Но можно зарегистрировать отдельный домен (или создать бесплатный поддомен от уже купленного домена). Создать с ним сайт (не ставить на него Вордпресс), а использовать чисто под загрузку файлов, чтобы не мешать все в кучу.

Читать еще:  Создать сайт визитку бесплатно

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

Давайте рассмотрим на примере с отдельным сайтом на поддомене. Показываю на своем хостинге Timeweb. Поддомен тут создается в пару кликов.

Идем в раздел «Домены и поддомены». Напротив домена жмем по иконке плюса (добавить поддомен).

Указываем название поддомена – короткое латиницей или цифры.

На этом же шаге можем сразу создать сайт с нашим поддоменом. Для этого выбираем «Создать директорию» и указываем ее название. Лучше всего называть директорию так же, как называется ваш поддомен, чтобы не путаться.

Ниже под вашим доменом отобразится добавленный поддомен.

А в разделе «Сайты» отобразится ваш новый сайт:

Также в разделе «Файловый менеджер» появляется корневая папка этого сайта (она называется аналогично директории, к которой привязан домен) – в эту папку и загружаются любые файлы.

Загрузим архив с материалами, которыми хотим поделиться для скачивания. К примеру, у меня есть бесплатность – комплект чек-листов для набора подписчиков. На компьютере они лежат в папке, для загрузки на хостинг я ее запакую в архив. Например, в zip. Но перед этим обязательно нужно назвать папку латиницей, без пробелов и лишних символов.

Для добавления в архив, нажимаем по папке правой кнопкой мыши – выбираем пункт “Добавить в архив”.

Затем иду на хостинг в «Файловый менеджер», захожу в корневую папку своего сайта (открываю двойным кликом левой кнопкой мыши).

Внутри открываю папку public_html и в нее загружаю свой архив.

Загрузить можно перетаскиванием архива с рабочего стола компьютера на строку «Чтобы добавить файлы, перетащите их в это окно». Просто сворачиваем браузер, идем на рабочий стол, жмем по архиву левой кнопкой мыши и, удерживая, тянем его во вкладку браузера с открытой корневой папкой.

Читать еще:  Как создать динамический сайт

При загрузке этим способом нас спрашивают «Распаковать архив?» – распаковывать не надо. Выбираем «Только загрузить».

Второй вариант загрузки – через вкладку «Файл» – «Загрузить на сервер».

Таким образом, архив оказывается в корневой папке нашего сайта на хостинге.

Ссылка на скачивание архива формируется так: ваш домен/название архива.zip или ваш домен/название архива.rar (то есть в конце после точки обязательно добавляется формат архива).

В моем случае ссылка на скачивание архива выглядит так: 123.viktoriiakarpova.ru/lists.zip

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

А теперь загрузим рdf-книгу, ссылкой на скачивание которой хотим поделиться.

Точно также идем в корневую папку сайта в «Файловом менеджере» и через вкладку «Файл» – «Загрузить на сервер» загружаем наш pdf с рабочего стола. Или перетаскиваем левой кнопкой мыши в строку загрузки.

Как и архив, pdf должен называться латинскими буквами без пробелов и лишних символов. Можно использовать дефис или нижнее подчеркивание в названии.

Ссылка на скачивание этого файла формируется так: ваш домен/название документа.pdf. Здесь аналогично – в конце после точки обязательно добавляется формат документа.

В моем случае ссылка выглядит так: 123.viktoriiakarpova.ru/keys.pdf

Когда мы перейдем по ссылке, pdf документ откроется в браузере – его можно просматривать онлайн (все ссылки внутри будут кликабельны), либо скачать себе, нажав вверху справа по стрелке.

кликните на скриншот для увеличения

Кстати, этот вариант с загрузкой pdf на хостинг можно использовать для добавления политики конфиденциальности, договора-оферты на свой сайт и т.д.

Итак, в этой статье мы разобрались с вопросом – как загружать на свой хостинг файлы (архивы, pdf документы) и делиться ссылкой на их скачивание.

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