dom rit
dom rit

Reputation: 1

i don't understand the localStorage method

i am new to JavaScript and this site and i am trying a mock up site where one webpage will let you create a username and password. then it will send it to a webpage that if you log in to it using your username and password then it will take you to Google. i have not gotten to making it so you can create a username and password and have just for now used a built in one. i am having trouble getting the variable defined on one web page to go to the other by the localStorage method. pleas help me understand in a simple easy way for a newbie.

here is the page where the variables are defined.

 <!DOCTYPE html>
<html>
<head>

<title>
create account
</title>


<script>

localStorage["username1"] = ['jk', 'lol'];
localStorage["password1"] = ['p1', 'p2'];

</script>


</head>

<body>

</body>


</html>

here is the page where i use the defined variables.

<!DOCTYPE html>
<html>
<head>

<title>
create account
</title>


<script>

localStorage["username1"] = ['jk', 'lol'];
localStorage["password1"] = ['p1', 'p2'];

</script>


</head>

<body>

</body>


</html>

Upvotes: 0

Views: 223

Answers (3)

Sudhir Bastakoti
Sudhir Bastakoti

Reputation: 100175

Read about localStorage before trying to use it. Basically all you have to do is modify the localStorage object in JavaScript. You can do that directly or use the setItem() and getItem() methods:

var credentials = {};
credentials.username = "my_username";
credentials.password = "my_password";
//save in localStorage
localStorage.setItem( 'credentials', JSON.stringify(credentials) );
//now to access the items from localStorage, do
var creds = JSON.parse( localStorage.getItem( 'credentials' ) );
console.log( creds );

Upvotes: 0

Josh Lankford
Josh Lankford

Reputation: 468

MDN has a great reference and examples for local storage: https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage

Your code will need to look something like -

// Save data
sessionStorage.setItem("username1", "jk");
sessionStorage.setItem("password1", "p1");

// Get data
alert( "username = " + sessionStorage.getItem("username1"));
alert( "username = " + sessionStorage.getItem("password1"));

Upvotes: 1

Gareth Parker
Gareth Parker

Reputation: 5062

Although you shouldn't be using javascript for usernames and passwords, and you should never be putting the username and password on the client side (With LocalStorage, the user can go in and see the password themselves, or change it even, I believe what you're looking for are localStorage.getItem(key) and localStorage.setItem(key, value)

Like this

localStorage.setItem('testing', 'abc');
console.log(localStorage.getItem('testing'));

Note: localStorage is not compatible with older browsers. If any users might be using older browsers, it's a good idea to check if it has localStorage. Maybe something like

if(localStorage != undefinfed)
{
    localStorage.setItem('testing', 'abc');
    console.log(localStorage.getItem('testing'));
}
else
{
    //Browser not supported
}

Also, localStorage only stores data for that page. Once you change pages, your localStorage is cleared. For keeping data between pages, use sessionStorage in the exact same manner

Upvotes: 0

Related Questions