nmk

Лабораторна робота №8 (2 години)

Тема: Завантаження файлів (Робота з файлами). Додавання до форми атрибута enctype="multipart/form-data" та завантаження файлу завдання на локальний диск сервера.

Мета: Навчитись обробляти файли, які надсилає користувач (зображення, документи), розуміти специфіку протоколу HTTP для бінарних даних та структуру масиву $_FILES.

Технологічний стек: HTML (type="file"), HTTP Headers (multipart/form-data), PHP ($_FILES, move_uploaded_file()).

Завдання

  1. Додати підтримку завантаження файлів до існуючої форми.
  2. Розширити обробник POST-запиту для правильного приймання та аналізу бінарних даних (картинок).
  3. Написати базову файлову валідацію (перевірка формату .jpg/.png та розміру в МБ).
  4. Перемістити фізичний файл із тимчасової папки (tmp) ОС у публічну директорію проєкту за допомогою move_uploaded_file().

Хід виконання роботи

Крок 1. Налаштування форми (enctype)

У файлі форми create.php додайте нове поле: <input type="file" name="avatar" accept="image/png, image/jpeg">. Абсолютно критично: змініть тег форми, додавши атрибут enctype="multipart/form-data". Без цього браузер проігнорує ваш файл і передасть лише його назву текстом у $_POST.

Крок 2. Інспектування $_FILES

Під час обробки натискання кнопки “Зберегти” додайте до вашого існуючого var_dump() новий рядок: var_dump($_FILES);. Спробуйте завантажити картинку. Ви побачите, що $_FILES['avatar'] — це багатовимірний асоціативний масив, який містить інформацію про ім’я файлу (name), його тимчасовий шлях на сервері (tmp_name), розмір в байтах (size) та наявність помилок завантаження (error).

Крок 3. Безпека: Валідація Розширення та Розміру

До блоку обробки $errors (з Лаб. 7) додайте валідацію картинки. Перевірте:

Крок 4. Збереження файлу

Створіть у корені проєкту (там, де файл index.php) нову папку uploads. Щоб зберегти файл довгостроково, викличте PHP-функцію: move_uploaded_file($_FILES['avatar']['tmp_name'], 'uploads/' . $_FILES['avatar']['name']); Якщо форма пройшла всю валідацію успішно, функція має перемістити файл у вашу папку. Відкрийте VS Code та перевірте зліва в провіднику, що файл дійсно з’явився у папці uploads.

Контрольні запитання

  1. Що таке enctype="multipart/form-data" і чому його обов’язково треба використовувати в тегу form для файлів?
  2. Які ключі завжди присутні в масиві для конкретного файлу в $_FILES? Опишіть призначення ключа tmp_name.
  3. Чому файли не зберігаються одразу у вашій папці проєкту після натискання Submit, а містяться в тимчасових директоріях операційної системи (tmp_name)?
  4. Для чого ми використовуємо функцію move_uploaded_file()? Чому не можна просто скопіювати файл звичайною функцією copy() без перевірок безпеки?
  5. Які потенційні загрози несе дозвіл користувачам “завантажувати будь-що” на сервер (без перевірки розширення чи типу)?

Вимоги до звіту

  1. У файл lab8.md надіслати код обробника файлових завантажень.
  2. Додати скриншот папки uploads з бокової панелі VS Code з хоча б одним успішно завантаженим збереженим файлом із вашим аватаром/зображенням.
  3. Додати скриншот сторінки браузера, яка через var_dump($_FILES) демонструє масив із 5 ключами (наприклад, name, type, tmp_name, error, size) для вашого файлу.
  4. Надати відповіді на контрольні запитання.
  5. Закомітити на GitHub (не забудьте додати папку uploads/* в .gitignore, щоб не “смітити” в репозиторії бінарними файлами!).