Первоначальное назначение <input type = «hidden»>? [закрыто]


101

Мне интересно узнать о первоначальной цели <input type="hidden">тега.

В настоящее время он часто используется вместе с JavaScript для хранения в нем переменных, которые отправляются на сервер и тому подобного.

Таким образом, JavaScript <input type="hidden">существовал до того , каково было его первоначальное предназначение? Я могу только представить себе отправку значения с сервера клиенту, которое (без изменений) отправляется обратно для поддержания своего рода состояния. Или я ошибаюсь в истории этого и <input type="hidden">всегда должен был использоваться вместе с JavaScript?

Если возможно, дайте также ссылки в своих ответах.


3
Не по теме для SO, хотя поддержание состояния также было бы моим выбором
Фил

Согласовано, чтобы разрешить отслеживание предварительно заполненного состояния (например, суррогатного ПК во время редактирования), которое будет автоматически включаться в отправленную форму POST / GET
StuartLC

1
Существовавший до того, как JavaScript поддерживал причины иметь их еще больше (то есть, это не умаляет какой-либо причины, как, кажется, подразумевает этот вопрос) - не было JavaScript для «хранения переменных» или вызова AJAX или заглушки в «не скрытых» ввод полей перед отправкой формы ... также не было CSS для других извращенных хаков, таких как скрытие обычного ввода текста.
user2246674

Ответы:


108

Я могу только представить себе отправку значения с сервера клиенту, которое (без изменений) отправляется обратно для поддержания своего рода состояния.

Точно. Фактически, он все еще используется для этой цели сегодня, потому что HTTP, каким мы его знаем сегодня, по-прежнему, по крайней мере, в основном, протокол без сохранения состояния.

Этот вариант использования был впервые описан в HTML 3.2 (я удивлен, что HTML 2.0 не включал такого описания):

type=hidden
Эти поля не должны отображаться и предоставлять серверам средства для хранения информации о состоянии в форме. Он будет передан обратно на сервер при отправке формы с использованием пары имя / значение, определенной соответствующими атрибутами. Это обход безгражданства HTTP. Другой подход - использовать HTTP-файлы cookie.

<input type=hidden name=customerid value="c2415-345-8563">

Хотя стоит упомянуть, что HTML 3.2 стал рекомендацией W3C только после первоначального выпуска JavaScript, можно с уверенностью предположить, что скрытые поля почти всегда служили одной и той же цели.


Единственное, что мне не нравится в использовании «скрытых» входов для хранения данных, это то, что этими данными могут управлять пользователи, предоставленные, вероятно, только тем, кто понимает HTML и как изменять его с помощью инструментов разработчика, но может иметь плохие последствия для база данных, если изменение этих значений повреждает другие данные (например, если вы храните ссылку на первичный ключ, и она вручную изменена пользователем).
Brett84c

3
@ Brett84c: Вот почему вы всегда должны проверять свой ввод и никогда не доверять клиенту;)
BoltClock

Точнее, я просто бросил это там, чтобы новые разработчики знали о возможных опасностях.
Brett84c

2
Ничто в этих опасностях не относится к «скрытым» входам - все, что отправлено клиенту, можно изменить до того, как оно вернется. Файлы cookie или альтернативы на основе JS - это одно и то же.
FLHerne

10

Я приведу здесь простой пример реального мира на стороне сервера, скажем, если записи зациклены и каждая запись имеет форму с кнопкой удаления, и вам нужно удалить конкретную запись, так что вот hiddenполе в действии, иначе вы выиграете ' t получить ссылку на удаляемую запись, в этом случае она будетid

Например

<?php
    if(isset($_POST['delete_action'])) {
        mysqli_query($connection, "DELETE FROM table_name 
                                   WHERE record_id = ".$_POST['row_to_be_deleted']);
                                   //Here is where hidden field value is used
    }

    while(condition) {
?>
    <span><?php echo 'Looped Record Name'; ?>
    <form method="post">
        <input type="hidden" name="row_to_be_deleted" value="<?php echo $record_id; ?>" />
        <input type="submit" name="delete_action" />
    </form>
<?php
    }
?>

1
Хороший пример, за исключением того, что реальный код должен использовать подготовленные операторы или другой способ безопасной обработки ввода SQL.
Мэтью Флашен

8

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

Из спецификации HTML от 22 сентября 1995 г.

Элемент INPUT с `TYPE = HIDDEN 'представляет скрытое поле. Пользователь не взаимодействует с этим полем; вместо этого атрибут VALUE определяет значение поля. Атрибуты NAME и VALUE обязательны.


1
Не могли бы вы подробнее рассказать об этом ответе и / или дать некоторую ссылку на такое поведение при отправке скрытых полей после отправки формы?
GitaarLAB

@GitaarLAB, я привел пример (идентификатор пользователя) ... Во всяком случае, в сети много примеров. Например, echoecho.com/htmlforms07.htm
Чак Норрис

1
Простите, мне строчка: original purpose was to make a field which will be submitted *after* form's submitнеоднозначна. Это может быть истолковано как: «после того , как форма делается размещения его данные, то скрытое поле будет представлено (в таинственном месте)». Отсюда мой комментарий выше.
GitaarLAB

1
Понятно :) Спасибо за комментарий, ответ отредактировал. Это просто орфографическая ошибка (еще не достиг уровня гуру по английскому: D).
Чак Норрис

6

Значения элементов формы, включая type = 'hidden', отправляются на сервер при публикации формы. Значения input type = "hidden" не отображаются на странице. Например, сохранение идентификаторов пользователей в скрытых полях - одно из многих применений.

SO использует скрытое поле для щелчка вверх.

<input value="16293741" name="postId" type="hidden">

Используя это значение, серверный скрипт может сохранить голосование.


Ха-ха, хороший улов! И когда я добавляю «x» в конце значения, при голосовании за поддержку возникает ошибка: D
Uooo

@Uooo И вы можете показать это или напрямую изменить значение. Вы можете изменить значение на другой ответ. Затем вы можете нажать на кнопку «проголосовать», и он будет зарегистрирован как голос «за» за другой ответ. ;)
Джеффри Хейл

5

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

  1. Токены CSRF.

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

  1. Сохраняйте состояние в многостраничных формах.

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

Общее правило: используйте это поле для хранения всего, что пользователю не нужно видеть, но что вы хотите отправить на сервер при отправке формы.

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.