Как сохранить значения полей формы HTML в localStorage с помощью JavaScript?

Question

Как сохранить значения полей формы HTML в localStorage с помощью JavaScript?

Вы можете создать GET API, не требуя аутентификации, да. Примером этого является JSON API Reddit. https://reddit.com/.json - это простой способ просмотра страницы на своем сайте в формате JSON, который затем может быть проанализирован моим сервером для отображения содержимого reddit. Нет логина, нет сообщений, нет аутентификации.

Однако вы заметите, что Reddit ограничивает то, что вы можете с этим сделать ... Я могу только читать информацию. НЕВОЗМОЖНО разрешать изменения базы данных через GET, когда поставляемые значения поступают от пользователя, и особенно если вы не используете протокол HTTPS с другими безопасными методами аутентификации. Я говорю об этом, потому что, когда у вас нет надлежащих лимитов скорости и нет формального метода аутентификации, который подключается к вашему серверу, становится невероятно легко разбивать ваши таблицы базы данных, если вы разрешаете изменения БД на лету через API ..

Теперь, для JWT - эта статья здесь отличная, которую я обычно посылаю людям: https://jwt.io/introduction/

Это довольно неплохо ломается, но в конечном итоге вы поймете, что JWT не слишком идеален для систем входа в систему. но не невозможно. Вот два примера похожих вопросов о SO, которые могут вам помочь :)

Безопасный REST API без аутентификации пользователя (без учетных данных)

How

Надеюсь, это поможет вам принять обоснованное решение.

Если вы действительно не хотите входа в систему, считаете ли вы, проверка? Это просто, цель JWT ослаблена без метода проверки того, кто идет с токеном с помощью других средств. Я лично не буду полагаться на JWT как на единую меру безопасности.

Вот пример простой & amp; secure REST API ... Это позволит кому-то получить некоторый контент для статьи блога (id) или что-то в этом роде.

prepare("SELECT content FROM table WHERE id = ?");
$db->bind_param("i", $id); 
$db->execute();
$db->bind_result($content);
$db->fetch();
$db->close();
echo $content; 
} else {
echo "What do you want?"; 
}
?>

Нет нужных токенов, нет необходимости в регистрации .. это простая выборка базы данных и amp; вывода для API GET.

0

javascript html forms

задан Oguntoye 19 January 2019 в 07:12

3 ответа

Другие вопросы по тегам:

javascript html forms

Похожие вопросы:

score 0 · Answer 1

В качестве альтернативы вы можете добавить Прослушиватель событий .
addEventListener vs onclick

0

ответ дан august 19 January 2019 в 07:12

score 0 · Answer 2

В тегах <script></script> или во внешнем js-файле

Получить элемент формы: const form = document.getElementById('form');

Добавить слушателя в прослушайте событие submit и сохраните ваши значения:

form.addEventListener('submit', () => {
  localStorage.setItem("name", document.getElementById("name").value);
  localStorage.setItem("adress", document.getElementById("adress").value);
  localStorage.setItem("number", document.getElementById("number").value);
})

Вы должны избегать использования встроенного JavaScript (если вы не используете платформу, например, реагировать (тогда это даже не совсем встроено)) .

score 0 · Answer 3

Если вы пытаетесь сохранить данные в localStorage при нажатии кнопки «Отправить», ваш код должен выглядеть следующим образом.

function onSubmit() {
  localStorage.setItem("name", document.getElementById("name").value);
  localStorage.setItem("adress", document.getElementById("adress").value);
  localStorage.setItem("number", document.getElementById("number").value);
}

<form class="w3-container" id="form">
  <p><label>Name</label><input class="w3input" type="text" id="name"></p>
  <p><label>Adress</label><input class="w3-input" type="text" id="adress"></p>
  <p><label>Number</label><input class="w3-input" type="text" id="number"></p>
  <button class="w3-button w3-blue" onclick="onSubmit()">Submit</button>
</form>