FoggyK / Lesson_6PHP.md
Функционал, отвечающий за отправку файлов на сервер, реализуется довольно просто. Как и в примерах из предыдущих уроков, за это отвечает специальное поле формы. Но ее настройка имеет некоторые особенности.
При осуществлении загрузки фйалов нужно обратить особое внимание на атрибуты enctype и method , задающие способ кодирования отправляемых данных и HTTP-метод запроса.
Если ваша форма содержит поля, отвечающие за загрузку файлов, то элементу
необходимо явным образом установить атрибут enctype в значение multipart/form-data , а method задать как POST .
Заметка
Приведенные выше значения атрибутов не связанны непосредственно с HTML. Они оптимизируют внутренние процессы браузера. Если вы правильным образом настроите элемент , отправка больших файлов будет произведена гораздо быстрее, а серверная программа сможет легко принять и обработать их.
Использование поля загрузки файлов
В HTML для отправки файлов из формы используется многозадачный элемент . Его атрибут type должен иметь значение file . Браузер отобразит такое поле в виде кнопки с текстом «выберите файл» или аналогичным.
При нажатии кнопки откроется проводник файловой системы. В нем можно перемещаться по директориям компьютера. Интерфейс интуитивно понятен любому пользователю. Все что нужно сделать — это найти нужный файл и нажать кнопку «Открыть». Отметим, что выбирать нужные документы и файлы может только сам пользователь. Явное указание атрибута value с именем или расположением какого-либо файла не приведет к успеху.
Чтобы выбранный файл был загружен при отправке формы, полю необходимо добавить атрибут name с уникальным значением.
Множественный выбор и блокировка поля
По умолчанию пользователь может выбрать только один файл, предназначенный к отправке. HTML позволяет изменить это поведение. Множественный выбор станет доступным после добавления к полю атрибута multiple .
Также нужно отметить, что поле загрузки файлов можно заблокировать с помощью атрибута disabled . Это сделает невозможным какое-либо взаимодействие с ним. Если оно заблокировано после осуществления выбора файла, он не будет отправлен вместе с остальными данными формы. Такая ситуация может возникнуть при использовании встроенного в браузер языка программирования JavaScript.
Загрузка файла на сервер может быть выполнена как с помощью веб-формы, расположенной на странице сайта, так и прямым программным запросом. Для PHP-интерпретатора способ передачи файла не имеет значения. Спецификация HTTP-протокола приводит эти операции к единообразному виду.
Любой загружаемый файл будет помещен в специальную директорию для временного хранения, а связанная с ним информация добавлена в суперглобальный массив $_FILES . Если не переместить файл в другое место, после завершения скрипта произойдет его бесследное удаление. Директория временного хранения определяется настройкой upload_tmp_dir конфигурационного файла php.ini .
Суперглобальный массив $_FILES
Если вместе с текущим запросом были загружены файлы, PHP-интерпретатор автоматически заполнит суперглобальный массив $_FILES соответствующей информацией. Его структура довольно проста. Элементы массива соответствуют именам параметров HTTP-запроса. Например, ваша веб-форма содержит поле загрузки файла с атрибутом « name=»upload-file» ». В таком случае информация будет добавлена в $_FILES[‘upload-file’] .
Содержимое массива $_FILES:
- $_FILES[‘поле-запроса’][‘name’] — реальное имя файла, которое он имел до отправки.
- $_FILES[‘поле-запроса’][‘size’] — размер загруженного файла в байтах.
- $_FILES[‘поле-запроса’][‘type’] — MIME-тип файла.
- $_FILES[‘поле-запроса’][‘tmp_name’] — содержит имя файла, которое назначил ему интерпретатор при размещении во временную директорию;
- $_FILES[‘поле-запроса’][‘error’] — код ошибки, возникшей при загрузке. Если всё нормально, элемент будет иметь значение « 0 ». http://php.net/manual/ru/features.file-upload.errors.php Поле веб-формы может иметь атрибут multiple , позволяющий осуществлять множественный выбор файлов. В таком случае элементы name , size , type , tmp_name и error будут являться массивами. Например, загружены два файла через поле формы с именем test-file . Получить имя первого файла можно в $_FILES[‘test-file’][‘name’][0] , а второго $_FILES[‘test-file’][‘name’][1] .
Заметка
Существует одно требование к HTML-разметке полей, осуществляющих множественный выбор и загрузку файлов. Их атрибут name должен быть составлен следующим образом « name ». Если вы опустите конструкцию [] , PHP обработает только один файл.
Перемещение загруженного файла
Как говорилось выше, загружаемые файлы размещаются во временной директории сервера и автоматически удаляются PHP-интерпретатором после выполнения текущего запроса. Их можно сохранить, переместив в другое место. Использовать стандартные функции copy() или rename() крайне нежелательно.
Для перемещения загруженных файлов существует специальная функция move_uploaded_file() . Она принимает два обязательных строковых параметра. Первый указывает имя файла во временной директории, а второй — путь назначения. Функция возвращает true в случае успеха и false , если произошла ошибка.
С помощью функции is_uploaded_file() вы можете проверить, является ли файл загруженным в текущем запросе. Она принимает всего один параметр — имя файла, а возвращает результат логического типа.
//Определяем место сохранения загруженного файла и его имя $destination = $_SERVER['DOCUMENT_ROOT']. '/uploads'; $fileTempName = $_FILES['parameter']['tmp_name']; if (is_uploaded_file($fileTempName)) < //Проверяем тип файла и меняем его имя в соответствии $newFilename = $destination .'/user'; switch ($_FILES['parameter']['type']) < case 'application/pdf': $newFilename .= '-document.pdf'; break; case 'video/mp4': $newFilename .= '-video.mp4'; break; default: echo 'Файл неподдерживаемого типа'; exit; >//Перемещаем файл из временной папки в указанную if (move_uploaded_file($fileTempName, $newFilename)) < echo 'Файл сохранен под именем '. $newFilename; >else < echo 'Не удалось осуществить сохранение файла'; >> else
Важно
PHP позволяет изменять местоположение загруженных файлов с помощью обычных функций копирования или перемещения. Однако это довольно опасно. Существует ряд ухищрённых атак, основанных на таком недальновидном подходе.
Для перемещения и проверки существования загруженных файлов всегда используйте функции move_uploaded_file() и is_uploaded_file() . В процессе выполнения они осуществляют расширенные проверки и автоматически отсеивают ряд распространенных атак.
Пример загрузки файла на сервер
Ниже приводится пример PHP-скрипта. Если он вызывается в первый раз, либо в текущем запросе отсутствует загрузка файла, пользователю выводится форма. При загрузке, файл перемещается в корневую директорию сайта, а пользователю показывается информация, связанная с ним. Обрабатываются только изображения в форматах jpg , jpeg и png .
//Перемещаем файл из временной папки в указанную if (!move_uploaded_file($uploadInfo['tmp_name'], $newFilename)) < echo 'Не удалось осуществить сохранение файла'; >?>
- Размер файла: байт
- Имя до загрузки:
- MIME-тип:
Полностью своя кнопка «Выбрать файл»
Предлагаю на суд сообщества свой велосипед. На написание данного текста вдохновил Способ №5 из материала Делаем красивый input[type=file] для адаптивного сайта… И да — все работает в IE, начиная с 9 версии.
Цель: создать свою кнопку/элемент управления по нажатию которой происходит загрузка файла на сервер (либо иные, предусмотренные разработчиком, файловые операции).
Инструменты: CSS, PHP, JavaScript.
Используемые технологии: Ajax, через скрытый iframe.
Преамбула
Из кода для упрощения сознательно выкинуты все процедуры проверки принятого файла и try-catch вызовов функций, так как эти моменты не являются темой данной статьи. Также не охватывается момент по предотвращению звукового сигнала в IE. В работе используем технологию Ajax, подразумевающую, что у нас есть основная страница, осуществляющая взаимодействие с пользователем(front-end) и скрипт на сервере, обрабатывающая наши запросы(back-end)
Технология работы
1. На главной странице создаем «form action» Делаем ей target на скрытый фрейм, который создаем статически (или динамически). Создаем два «input» с типом «file» и «submit», даем им «id», помещаем их в «div», который спрячем со страницы стилем. Все эти элементы не видимы для пользователя и не воспринимают каких-либо его действий.
2. Начинаем «магию». Для «input» с типом «file» на событие по изменению вешаем вызов функции onchange=«LoadFile();».
3. На главной странице создаем кнопку. Навешиваем ей на событие нажатия кнопки мыши вызов функции onclick=«FindFile();».
4. В функции FindFile() имитируем клик на «input» с типом «file». То есть при нажатии на нашу кнопку вызывается стандартный диалог выбора файла. Как только пользователь выбрал файл, срабатывает событие onchange и вызывается функция LoadFile(). В функции LoadFile() имитируем клик на «input» с типом «submit».
5. Форма формирует POST запрос с именем файла к нашему back-end скрипту, который осуществляет все проверки по безопасности и загрузку файла. После этого скрипт вызывает callback функцию главной страницы, которой сообщает о результате выполнения.
Собственно все. Для примера приведены четыре основных файла, код которых приведён ниже:
css/style.css – стили главной страницы
view/upload.php – back-end скрипт загрузки файла
index.php – главная страницы
js/upload.js – front-end скрипты главной страницы
Кроме того, необходим любой файл с картинкой для кнопки buttons/openfile.png
Загружаемые файлы помещаем в директорию ../temp/
.navButtons < border:1px gray solid; position:absolute; overflow: hidden; display:block; height:50px; width:50px; margin:10px; -moz-box-shadow:5px 5px 7px rgba(3,33,33,.7); -webkit-box-shadow: 5px 5px 7px rgba(3,33,33,.7); box-shadow: 5px 5px 7px rgba(3,33,33,.7); -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; >.navButtons:hover < border:2px solid black; background-color:#fff; >.hiddenInput < position:absolute; overflow: hidden; display:block; height:0px; width:0px; >Input мы просто делаем нулевой ширины и высоты window.parent.onResponse("'.$obj.'"); '; > // определяем куда скопируем файл пользователя $dir = '../temp/'; $name = basename($_FILES['loadfile']['name']); $file = $dir . $name; //копируем файл и получаем результат $success = move_uploaded_file($_FILES['loadfile']['tmp_name'], $file); //вызываем callback функцию и передаем ей результат jsOnResponse(""); ?> 