Початкове призначення <input type = "hidden">? [зачинено]


101

Мені цікаво початкове призначення <input type="hidden">тегу.

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

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

Якщо можливо, будь ласка, також дайте посилання у своїх відповідях.


3
Поза темою для SO, хоча збереження стану також буде моїм вибором
Phil

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

1
Існуючі раніше JavaScript підтримує причин, щоб їх ще більше (тобто це не погіршує жодної причини, як це здається, це питання) - не було JavaScript, щоб "зберігати змінні" або викликати AJAX або заглушку в "не прихованому" вході поля перед надсиланням форми .. також не було CSS для інших збочених хак, таких як звичайне введення тексту приховано.
user2246674

Відповіді:


108

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

Точно. Насправді він все ще використовується для цієї мети сьогодні, оскільки HTTP, як ми його знаємо сьогодні, все ще є, принаймні принципово, протоколом без громадянства.

Цей випадок використання був вперше описаний у HTML 3.2 (я здивований, що HTML 2.0 не містив такого опису):

type=hidden
Ці поля не повинні відображатись і надають сервери засоби для зберігання інформації про стан із формою. Це буде передано на сервер під час подання форми з використанням пари імен / значень, визначених відповідними атрибутами. Це обробка для безгромадянства HTTP. Іншим підходом є використання HTTP "Cookies".

<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

Коротше кажучи, первісна мета полягала в тому, щоб зробити поле, яке буде подано з поданням форми. Іноді виникає потреба зберігати певну інформацію у прихованому полі (наприклад, ідентифікатор користувача) та надсилати її з поданням форми.

Із специфікації 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 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.