仅在登录时在本地存储器中显示对象

问题描述：

我正在创建一个创建网站的学校项目。在注册帐户后，我设法将用户数据保存到本地存储中。当我昨天尝试使用以下代码时，代码可能会起作用：在我以用户身份登录后，“currentUser”键将出现在本地存储中。但是，在我清除本地存储（阵列中的用户太多）后，我再次重新运行代码，currentUser将不再显示在本地存储中。这里是我的代码：从编辑个人资料页： `仅在登录时在本地存储器中显示对象

<script> 
var currentUser=null; 
document.addEventListener("DOMContentLoaded",loadUserData); 

function loadUserData() { 
currentUser = localStorage.getItem("currentUser"); 
if(currentUser!=null) { 
currentUser = JSON.parse(currentUser); 

    } 
} 
</script>

上面的代码加上这从登录HTML显示currentUser在本地存储的密钥（应该只出现在作为当前用户登录）从登录页面：

function checkUser(ev) { 
      ev.preventDefault(); 
      var status=false; 

      var username = document.getElementById("username").value; 
      var password = document.getElementById("password").value; 


      for(var i=0;i<userList.length;i++) { 
      var u=userList[i]; 
      console.log(u.username); 
      console.log(u.password); 
      if (u.username==username && u.password==password){ 
      status=true; 
      currentUser=userList[i]; 
      break; 
      } 
      } 

      if (status==true){ 
      location.href="EditProfile.html"; 
      } 

    }

我问我的朋友，她说，我提到我的用户名和密码的方式是不正确的，我需要重写我的大部分代码？

答

登录用户时您需要存储在localStorage中。当用户注销时，您应该清除localStorage CurrentUser密钥。

事情是这样的：

function checkUser(ev) { 
     ev.preventDefault(); 
     var status=false; 
     var username = document.getElementById("username").value; 
     var password = document.getElementById("password").value; 


     for(var i=0;i<userList.length;i++) { 
     var u=userList[i]; 
     console.log(u.username); 
     console.log(u.password); 
     if (u.username==username && u.password==password){ 
     status=true; 
     localStorage.setItem('CurrentUser', username); 
     currentUser=userList[i]; 
     break; 
     } 
     } 

     if (status==true){ 
     location.href="EditProfile.html"; 
     } 

}

使用此功能可以删除localStorage的关键，当用户注销。

localStorage.removeItem（key）;

您好，感谢您的建议，currentUser没有出现在本地存储，但是在价值它只显示用户名。如何将当前用户变成一个对象，使其显示如下：{“username”：“staff”，“name”：“alice tan”，“password”：“123”}？本地存储中显示的是：员工（当前用户的值部分） – blackJack

答

您正在使用不能存储超过5MB数据的HTML5本地存储。无论何时使用将本地存储和会话存储中的用户名和密码存储在其编程的坏习惯中。你让人们渗透到你的网站。尝试使用您正在用于服务器端的任何编程语言的会话。而且你会自己摧毁这个会话，那么显然你不会再获得价值。所以成为一个好的编程习惯使用服务器端。

答

简单的做到这些

function checkUser(ev) { 
    ev.preventDefault(); 
    var status=false; 

    var username = document.getElementById("username").value; 
    var password = document.getElementById("password").value; 


    for(var i=0;i<userList.length;i++) { 
    var u=userList[i]; 
    console.log(u.username); 
    console.log(u.password); 
    if (u.username==username && u.password==password){ 
    status=true; 
        localStorage.setItem("currentUser",u);//store whole data of logged user 
    currentUser=userList[i]; 
    break; 
    } 
    } 

    if (status==true){ 
    location.href="EditProfile.html"; 
    }

}

仅在登录时在本地存储器中显示对象

相关推荐