Tengo una página de inicio de sesión html y uso javascript para ocultar el nombre de usuario y la contraseña:
JavaScript:
function myFunction(){ var user = document.getElementById("username").value; var pass = document.getElementById("pass").value; if(user == "user1" && pass == "zzxx"){ window.location.href="about.html"} else if(user == "user2" && pass == "xxzz"){ window.location.href="about2.html"} else if(user == "user3" && pass == "ooppp"){ window.location.href="about3.html" } else{ alert("Incorrect username or password"); }HTML:
html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title>Login</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="css/bootstrap.min.css"> <script src="js/jquery.min.js"></script> <script src="js/bootstrap.min.js"></script> <link rel="stylesheet" href="css/style.css"> <script src="js/jquery-1.8.2.js"></script> <script type="text/javascript" src="js/invisible_debut.js" ></script> </head> <body> <div class="loginBox"> <h1>Login</h1> <div class="textbox"> <i class="fas fa-user"></i> <input name="username" id="username" type="text"placeholder="Username"> </div> <div class="textbox"> <i class="fas fa-lock"></i> <input name="pass" id="pass" type="password"placeholder="Password"> </div> <button value="Submit" class="btn btn-success" onclick="myFunction()">Submit</button> </form> </div> </body> <div class="bg"></div> </html>Quiero evitar que el usuario vaya a about.html escribiendo directamente ..../about.html Solo quiero que las personas inicien sesión con el nombre de usuario y la contraseña. ¿Cómo puedo hacer eso? ¡Muchas gracias!
puede usar document.referrer para verificar si es su sitio web o no
Deberá almacenar cierta información en
localStoragepara asegurarse de que este usuario ya visitó e inició sesión en su sitio web. Cuando los usuarios intenten ir directamente a la página Acerca de sin iniciar sesión, puede redirigirlos a la página de inicio de sesión.
Use el almacenamiento de sesión o el almacenamiento local para almacenar el valor del usuario, luego verifique ese valor en la página Acerca de, si no existe, redirija al usuario de regreso a la página de índice.
function myFunction() { var user = document.getElementById("username").value; var pass = document.getElementById("pass").value; if(user == "user1" && pass == "zzxx") { window.sessionStorage.setItem("user", "user1"); window.location.href="about.html" } else if(user == "user2" && pass == "xxzz") { window.sessionStorage.setItem("user", "user2"); window.location.href="about2.html" } else if(user == "user3" && pass == "ooppp") { window.sessionStorage.setItem("user", "user3"); window.location.href="about3.html" } else { alert("Incorrect username or password"); }Use el elemento de almacenamiento de sesión anterior en la página Acerca de
window.onload = function() { if (window.sessionStorage.getItem("user")) { var usr = window.sessionStorage.getItem("user"); if(user != "user1") { window.location.replace("index.html"); } } else { window.location.replace("index.html"); } }