How to store variables within the browser cache? (JS)

Question

I am making a form and I want to store the data that the client enters in the browser cache, in case the tab is closed the client does not need to type everything again.

What is the best means to meet this need?

Answer 1

You can use Webstorage of an Object, such as localStorage of the fields:

imagine that you have two fields of input one with ID = name and another ID = lastname you can do localstorage of these fields thus:

var lastname = document.getElementById("lastname").value;
var name = document.getElementById("name").value;
localStorage.setItem("lastname", lastname);
localStorage.setItem("name", name);

where the first part within the parentheses represents the name of the "attribute" of localStorage, and can be referenced by localStorage.lastname / localStorage.name

Answer 2

Beyond the localStorage, also exists the sessionStorage (https://www.w3schools.com/html/html5_webstorage.asp), which turns out to be more secure, since it’s session-based, and complemented with an authentication system, it can be time-controlled