Пустой URL в атрибуте action HTML-формы: практика и последствия

Быстрый ответ

Обозначение атрибута action формы как action="" удобно для обработки данных на той же странице, где она себя находит. Однако, предпочтительнее всегда указывать пути в атрибуте action для большего понимания. Приведу пример:

<form action="#" method="post">
  <!-- поля формы -->
  <input type="submit" value="Отправить">
</form>

Не забывайте обеспечивать адекватную серверную валидацию, чтобы надёжно защитить данные.

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

<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post">
  <!-- поля формы -->
  <input type="submit" value="Отправить">
</form>

Этот подход снижает риски безопасности, такие как угрозы кликджекинга, которые возможны при опущении атрибута action на страницах с конфиденциальными данными.

Рассмотрим атрибут 'Action'

Когда пропуск action является приемлемым

Отсутствие атрибута action приводит к отправке данных на текущий адрес страницы. Спецификация HTML предполагает использование заполненных URL.

Подробнее об этом расскажет наш спикер на видео

Риски, которые необходимо учитывать

С пустым значением action="" могут возникнуть разногласия в работе различных браузеров, особенно устаревших. К тому же, это нарушает синтаксис URI по стандарту RFC 3986, что приводит к запрещению его использования в рамках HTML5 для повышения безопасности.

Использование Action="#" может привести к прокручиванию страницы вверх после отправки формы, что негативно отражается на пользовательском опыте.

Обеспечение безопасности действий форм

Предотвращение угроз безопасности

Пустой или отсутствующий action может подвергнуть данные формы риску атак методом кликджекинга. Следование последним веб-стандартам и практикам безопасности обеспечит защиту ваших данных.

Незаменимые ресурсы в области безопасности

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

Непротиворечивость лучше двусмысленности – это заслуживает внимания

Непротиворечивость в коде часто важнее удобства. Указывая определенный URL в action, вы делаете ваш код более понятным и избегаете недоразумений или нежелательных эффектов. Это также облегчает понимание намерений формы другими людьми и программами, которые анализируют ваш код.

Мнение разработчика

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

Визуализация

Давайте визуализируем использование пустого атрибута action в форме, представив это как решение о месте доставки письма 📮:

Конверт (Форма 📄): Адресат (атрибут action) 🏷️

При использовании action="":

📄🏷️: ""
# Это как отправить письмо самому себе – письмо останется на текущей странице.

Если не указывать action:

📄🏷️: ??
# Без адреса? Почтальон (браузер) по умолчанию отправит письмо на ваше текущее местоположение.

Если указать URL в action:

📄🏷️: "URL"
# Это как отправить письмо другому человеку – письмо попадет туда, куда вы его отправили (на указанный URL).

Вывод: Пустой action аналогичен 💌 самому себе; ничего нового не произойдет.

Разумное применение атрибута 'Action'

Отдавайте предпочтение явным URL

В HTML5 рекомендуется использовать определенный URL в action. Это повышает понятность и облегчает понимание работы формы как пользователями, так и разработчиками.

Не пренебрегайте поведением браузера

Важно учесть различия в поведении браузеров в отношении пустого action. Обязательно проведите тестирование форм в разных браузерах, чтобы обеспечить стабильность их работы.

Поставьте безопасность на первое место

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

Полезные материалы

1. <form>: Элемент формы – HTML: HyperText Markup Language | MDN — рассмотрение использования атрибута action в формах на MDN Web Docs.
2. HTML Standard — официальные стандарты HTML от W3C, которые описывают поведение при отправке форм.
3. Атрибут action формы HTML — учебное пособие W3Schools, объясняющее принцип работы атрибута action в теге формы.
4. веб-стандарты – Это хорошая практика использовать пустой URL для атрибута action в HTML-форме? (action="") – Stack Overflow — обсуждение на Stack Overflow, где обсуждаются последствия использования пустого URL в атрибуте action.
5. WebAIM: Создание доступных форм – Введение в доступность форм — руководство от WebAIM о создании доступных форм. Здесь затрагиваются ключевые аспекты дизайна форм.