nmk

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

Тема: Валідація даних форми. Перевірка, чи не відправив користувач порожні поля, та безпечне виведення повідомлень про помилки над формою.

Мета: Ознайомитись із методами захисту та санації (очищення) введених користувачем даних, навчитись обробляти помилкові запити на стороні сервера (Backend Validation).

Технологічний стек: PHP (empty(), htmlspecialchars(), trim()), HTML5.

Завдання

  1. Заборонити відправку порожніх полів назви та опису.
  2. Створити механізм збору помилок валідації у масив $errors.
  3. Вивести користувачу зрозумілі повідомлення про помилки (наприклад, “Поле Назва не може бути порожнім”) над формою, якщо вони є.
  4. “Очистити” введені дані від зайвих пробілів та потенційно небезпечних HTML-тегів перед збереженням.

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

Крок 1. Санація (очищення) даних

Відкрийте файл create.php. У блоці обробки POST-запиту, перед тим як почати перевірки, очистіть отримані дані за допомогою суперглобального масиву $_POST:

Збережіть очищені значення в окремі змінні, наприклад $title = htmlspecialchars(trim($_POST['title']));.

Крок 2. Перевірка на порожнечу

Оголосіть порожній масив $errors = []; до обробки форми. Перевірте кожне отримане та очищене поле. Функція empty($title) перевіряє, чи змінна є “порожньою”. Якщо поле Назва або Опис порожні, додайте новий рядок із текстом помилки в масив $errors: $errors[] = "Поле Назва є обов'язковим для заповнення!";

Крок 3. Виведення помилок

У HTML-коді сторінки, безпосередньо над тегом <form>, перевірте, чи існують елементи у масиві помилок (if (!empty($errors))). Якщо так, запустіть цикл foreach та виведіть кожну помилку. Огорніть виведення у <div> із червоним стилем (наприклад, <div class="alert alert-danger">), щоб користувач чітко бачив проблему.

Крок 4. Збереження введених даних (Sticky Forms)

Завдання з “зірочкою” (необов’язкове для мінімальної оцінки, але рекомендоване). Якщо форма не проходить валідацію, усі поля автоматично очищуються. Зробіть так, щоб користувач не втрачав введений текст: додайте у поля <input value="..."> або <textarea> ... </textarea> в атрибути або всередину тегу попередньо введене значення, якщо воно наявне (<?= $title ?? "" ?>). Порожній оператор об’єднання з null ?? не видає помилку “Undefined variable”, а виведе порожній рядок.

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

  1. У чому принципова різниця між валідацією на фронтенді (через атрибут required в HTML / або на JS) та на бекенді (PHP)?
  2. Чому серверна валідація є критично необхідною з точки зору безпеки? Хто і як може обійти вашу HTML required-валідацію?
  3. Що робить функція trim()? Яку конкретну проблему (наприклад, при реєстрації пароля чи логіна) вона вирішує?
  4. Від чого захищає функція htmlspecialchars()? Наведіть приклад “поганого” тексту, який міг би зламати відображення сайту без цього захисту.
  5. Що таке масив помилок (Error Bag) і чому краще збирати всі помилки та показувати їх одночасно, а не використовувати die() чи exit() при першій-ліпшій невідповідності?

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

  1. У lab7.md винести фрагмент коду вашого блоку валідації (if ($_SERVER['REQUEST_METHOD'] === 'POST') { ... }).
  2. Обов’язково надати скриншот сторінки браузера, де над формою виведені червоним кольором дві різні помилки “Назва є обов’язковою” та “Опис є обов’язковим” після спроби натиснути “Зберегти” порожню форму.
  3. Надати відповіді на контрольні запитання.
  4. Надіслати посилання на Git-сховище із новітнім комітом.