Что такое type hidden

"Type hidden". "Что такое type hidden"

Разбираемся подробно, что означает type="hidden" в HTML.

О type="hidden":

1. Что такое type hidden?
2. Зачем нужен type hidden?
3. Пример использования type hidden.

1. Что такое type hidden

type="hidden" — значение атрибута type для элемента input, которое создаёт скрытое поле ввода в HTML‑форме.

Синтаксис type hidden

<input type=hidden>

Свойства type hidden

не отображается на странице;

не доступно для редактирования пользователем;

передаёт данные на сервер при отправке формы.

Для чего требуется "type hidden".

Для отправки на сервер данных пользователя, которые не выводятся на странице.

2. Зачем нужен type hidden?

ВНИМАНИЕ!
"type hidden" не предназначен для передачи секретной информации, поскольку доступен в начальном коде страницы!

Основные цели использования "type hidden"

Передача служебных данных

Скрытые поля хранят информацию, которую не должен вводить пользователь. Например:

ID записи в базе данных (чтобы понять, какую запись обновлять);

идентификатор сессии;

код страны или региона (если он фиксирован для пользователя);

версию формы или шаблона.

Отслеживание состояния многостраничных форм

Если форма разбита на несколько шагов, скрытые поля могут сохранять:

номер текущего шага;

промежуточные результаты;

данные из предыдущих шагов (чтобы не заставлять пользователя вводить их заново).

Защита от CSRF‑атак (межсайтовых подделок запросов)

В скрытые поля помещают токены безопасности (CSRF‑токены).

Сервер проверяет их при отправке формы: если токен отсутствует или неверен, запрос отклоняется.

Это усложняет задачу злоумышленникам, пытающимся подделать запросы от имени пользователя.

Сбор технической информации

С помощью JavaScript в скрытые поля можно записывать:

время загрузки страницы или заполнения формы;

параметры устройства (разрешение экрана, тип браузера);

действия пользователя (клики, перемещения мыши — для аналитики).

3. Пример использования type hidden.<

Пример кода с использованием type hidden:

<form method="post">

<input type="hidden" name="user_id" value="12345">

<input type="email" id="email" name="email">

<button type="submit">Отправить</button>

</form>

В приведенном примере "name="user_id" будет невиден пользователю.

Всего комментариев : Comments+ 2.0

+ =