Using localstorage to store login info

Question

I have been working on a project where we can store login info so that once a user registers, the data gets saved in the localStorage object. I have mentioned some javascript code to show that:

var user = document.getElementById("user");
var pass = document.getElementById("pass");
var email = document.getElementById("email");
var user2 = document.getElementById("user2");
var pass2 = document.getElementById("pass2");

function register() {
    localStorage.setItem("username", user.value);
    localStorage.setItem("password", pass.value);
    localStorage.setItem("email", email.value);
    document.getElementById("id01").innerHTML = "Registration successful";
}

function login() {
    var checkuser = localStorage.getItem("username");
    var checkpass = localStorage.getItem("password");
    if (checkuser === user2.value && checkpass === pass2.value) {
        document.getElementById("demo").innerHTML = "You are now logged in.";
    } else {
        document.getElementById("demo").innerHTML = "Incorrect username and password";
    }
}

In the javascript code mentioned above, i have used the localStorage object to store the values. I have stored the username in a user property, the password in a pass property and the email in an email property.

My question is: Is there any way where we can store the username, password and the email in one property(user property)?

You can create a single object of ``username``, ``email``, and ``password`` and store it in a localStorage. But do you really want a user's password to be exposed to anyone like this? It is not a good approach. — Not A Bot, Apr 10 '20 at 09:05
Maybe I can try to encrypt the password and store it in an sql database. @NotABot — , Apr 10 '20 at 09:39
It is always, better to do user authentication on server side. The approach you are following(Storing user password) on the user's system has many vulnerabilities like What if a user is using your service on a shared computer, then anyone can access the localStorage and see your user's password, email, etc. Then other websites can also access your localStorage data and steal the user's information. So whenever user visit your website, for login purpose always do server authetication for that user. — Not A Bot, Apr 10 '20 at 09:40
Read about how to store passwords in Database, that way you will get a better approach in storing passwords in Database. You don't need to do encryption on the user's password and store, as in case of any hacking if a hacker got access to a key that you are using to encrypt the password, then the hacker can use that key to decrypt the password too. So to prevent such cases we user ``hashing with salt``, where each salt in unique based on user information. If salting you are finding difficulty, then just use some good hashing algorithm like SHA-256, etc. @NSpeedzy — Not A Bot, Apr 10 '20 at 09:44
@NotABot Only the username and email will be stored in the localstorage. The password will be stored in the database — , Apr 13 '20 at 09:40

errorau · Accepted Answer · 2020-04-10T09:12:45.810

Yes, you can do this by putting all the features you want in one object.

Example here

var user = document.getElementById("user");
var pass = document.getElementById("pass");
var email = document.getElementById("email");
var user2 = document.getElementById("user2");
var pass2 = document.getElementById("pass2");
var user = {
email:email,
pass:pass,
//.. other properties 
}

then you can set like this

localStorage.setItam("USEROBJ",JSON.stringify(user));

When you want to call this you should use like

var user = JSON.parse(localStorage.getItam("USEROBJ"));

By the way you can read this

Storing Objects in HTML5 localStorage more detail about you question

score 0 · Answer 2 · answered Apr 10 '20 at 09:07

0

You can store JSON as a string in localStorage property and then parse it

function setUser() {
  localStorage.setItem('user', JSON.stringify(user));
}

function getUser() {
  user = JSON.parse(localStorage.getItem('user'))
}

answered Apr 10 '20 at 09:07

maciejze

177
7

Using localstorage to store login info

2 Answers2