如果未登录，则重定向 html 页面

Posted 2023-02-19

【中文标题】如果未登录，则重定向 html 页面

【英文标题】：redirect html page if not login

【发布时间】：2013-10-20 09:55:27

【问题描述】：

我的网页上有简单的登录表单。它使用javascript登录用户并且工作正常。 问题是用户直接在地址栏中输入登录页面网址，他可以直接访问该页面而无需登录。如果他没有登录，我想将他重定向到登录页面。 下面是loding和target page的链接。

登录：http://samdesign.comli.com/protected/index.html

目标：http://samdesign.comli.com/protected/user-soft.html

下面是使用的脚本..

<form>
<table align=center>
  <tr>
     <td>Username:</td>
     <td><input type="text" name="username" style="background:#bfbfbf;color:#212121;border-color:#212121;" onFocus="this.style.background = '#ffffff';" onBlur="this.style.background = '#bfbfbf';"></td>
  </tr>

  <tr>
     <td>Password:</td>
     <td><input type="password" name="password" style="background:#bfbfbf;color:#212121;border-color:#212121;" onFocus="this.style.background = '#ffffff';" onBlur="this.style.background = '#bfbfbf';"></td>
  </tr>

  <tr>
  <td></td>
  <td align=right><input type="button" value="Login" onClick="Login(this.form);" style="background:#bfbfbf;color:#000000;border-color:#212121;" onMouseOver="this.style.color = '#404040';" onMouseOut="this.style.color = '#000000';" onFocusr="this.style.color = '#404040';" onBlur="this.style.color = '#000000';"></td>
  </tr>
</table>
</form>

脚本是这样的

function Login(form) 
username = new Array("numair","sam","u3","u4","u5","u6","u7","u8","u9","u10","temporary");
password = new Array("nk1994","sf1993","p3","p4","p5","p6","p7","p8","p9","p10","user");
page = "/protected/user-soft.html";
if (form.username.value == username[0] && form.password.value == password[0] || form.username.value == username[1] && form.password.value == password[1] || form.username.value == username[2] && form.password.value == password[2] || form.username.value == username[3] && form.password.value == password[3] || form.username.value == username[4] && form.password.value == password[4] || form.username.value == username[5] && form.password.value == password[5] || form.username.value == username[6] && form.password.value == password[6] || form.username.value == username[7] && form.password.value == password[7] || form.username.value == username[8] && form.password.value == password[8] || form.username.value == username[9] && form.password.value == password[9] || form.username.value == username[10] && form.password.value == password[10]) 
self.location.href = page;

else 
alert("Either the username or password you entered is incorrect.\nPlease try again.");
form.username.focus();

return true;

任何人都可以帮忙举个例子吗？

【参考方案1】：

这不是进行身份验证的正确方法，您必须在服务器端保留身份验证逻辑，您可以在服务器端使用Node.js/Ruby-on-Rails(ROR)/JSP/ASP.NET（等等）。

为了确保您的页面安全，您必须在服务器端过滤器之前添加（这将检查用户的会话）。

【参考方案2】：

// Put this in your login function, just before the redirect
var sessionTimeout = 1; //hours
var loginDuration = new Date();
loginDuration.setTime(loginDuration.getTime()+(sessionTimeout*60*60*1000));
document.cookie = "CrewCentreSession=Valid; "+loginDuration.toGMTString()+"; path=/";


// Put this at the top of index page
if (document.cookie.indexOf("CrewCentreSession=Valid") == -1) 
  location.href = "/Login.html";

【讨论】：

放在self.location 之前？

【参考方案3】：

JavaScript 认证？？这不安全。所有身份验证都应在服务器端完成。

【讨论】：

我知道哥们，但要求是使用js...不能这样做吗？

您必须在身份验证时设置 cookie 并检查所有其他页面上的 cookie，如果未找到则重定向到登录页面。您至少应该在数组上散列密码，这样它们就不是纯文本了。寻找 JavaScript md5 库。