Выбор нескольких файлов
Приветствую вас, уважаемые читатели dosug.md. Сегодня в рамках рубрики для начинающих программистов хочу поговорить о такой неотъемлемой составляющей любого сайта, как HTML5 формы загрузки файлов. На каком бы движке не работал ваш сайт, на нем обязательно будут в том или ином виде использоваться HTML формы.
Во время моего поиска , я обнаружил, маленькую жемчужину в HTML5, которая позволяет загрузку нескольких файлов с помощью одного поля формы <input type='file'>.
Простая загрузки файлов был Святым Граалем многих дизайнеров и разработчиков интерфейса. К сожалению, HTML не делает их жизнь легче.
Хотя вполне возможно, загрузки нескольких файлов в то же время, это не возможно, чтобы выбрать эти файлы сразу. Вам необходимо создать несколько полей формы и выбрать каждый файл по отдельности. Хотя это не является большой проблемой, если вы хотите загрузить 2 или 3 файла, это может стать довольно скучной и утомительной задачей, если вы хотите загрузить 20, 30 или даже 100 файлов в то же время. Вы должны выбрать все эти файлы индивидуально и не может просто выбрать несколько файлов, после нажатия кнопки Browse ... кнопку поля формы файл.
Если вы загружаете файл, нет никаких признаков того, как долго происходит загрузка. Пользователь просто отправляет форму и ждёт, пока появится следующая страница. Если файл они загружают большой, это может занять некоторое время. Без обратной связи о том, что файл обрабатывается и приблизительное время это займет, пользователи могут стать нетерпеливым, если все по-прежнему работает правильно.
Это не возможно ограничить размер добавления перед тем как загрузить их на сервер. Можно, конечно, для ограничения размера на сервере и отвергать любые файлы, которые в течение определенного размера. Но в тех случаях, файл уже был загружен на сервер, не было бы гораздо лучше, чтобы дать предупреждение заранее. То же самое относится и к типам файлов, в настоящее время нет способов ограничения добавления к определенному типу файла или списка типов файлов.
Вместо того чтобы ждать надлежащего решения проблемы выше, многие разработчики перешли на Flash, чтобы обеспечить эту функциональность. Flash 8 предоставил нам простой в использовании API для выбора и загрузки файлов, которые не привязаны к какой-либо из этих ограничений. Вам даже не нужно построить весь сайт на Flash, вы можете просто вставлять невидимый объект Flash, что обеспечивает доступ к API Использование JavaScript. См. сайт SWFUpload для простой в использовании, открытая реализация использованием этого API.
Предстоящие спецификации HTML5 обещает правильное решение, по крайней мере два из ограничений. Загрузить файл элемент будет поддерживать выбор нескольких файлов одновременный и ограниченый выбора для файлов определенного типа. Существует также W3C рабочий проект для решения остающихся ограничений называется File Upload, но это может занять некоторое время для браузера по осуществлению этих улучшений.
Новые браузеры имеют поддержку Первое решение: выбор нескольких файлов. Вместо того чтобы писать:
<input name="uploads[]" type="file"/>
<input name='uploads[]" type="file"/>
<input name="uploads[]" type="file"/>
<input type="submit"/>
</form>
Нужно написать:
<form action='#' method='post' enctype='multipart/form-data'>
<input name='uploads[]' type="file" multiple="multiple" />
<input type="submit" value="Отправить" />
</form>
Примечание: Вы, наверное, заметили в скобках я использовал в названии элемента ввода. Это не требование спецификации HTML5, но это требование языка PHP сценариев которых я использую на сервере. Если вы добавите скобки, PHP получит массив загруженных файлов на сервере. Если вы уберёте скобки сервер обрабатает только последний файл в вашем скрипте. Для получения дополнительной информации об обработке нескольких загруженных файлов см. в руководстве PHP.