Javascript - 无法获取登录脚本只接受设置密码

时间:2014-03-18 05:42:38

标签: javascript login passwords

我正在尝试使用Javascript创建一个基本的登录屏幕,其中我没有太多经验。我设法得到了这么多,但出于某种原因,每当我在输入框中输入文本时,无论是否是正确的密码,它都会重定向我。

另外,第二个问题,为了确定用户是否已登录(将其重定向到登录页面),我是否必须使用除JS之外的其他东西,例如PHP?

代码:

<!doctype html>
<html>
    <head>
        <title>Login</title>
        <script type="text/javascript">
            function login()
                {
                if (password = "cat")
                    {
                    location.assign("home.html");
                    }
                }
        </script>     
    </head>
    <body>
        Password: <input type = "password" name = "password">
        <input type = "button" value = "Login" onclick = "login()">
    </body>
</html>

3 个答案:

答案 0 :(得分:2)

目前您使用的是if(password = "cat"),它实际上是一个未用于comparison的赋值运算符。如果您不知道要比较的数据类型,请使用==,否则您可以使用===

在其他词中

  • ==仅用于比较值。

  • ===用于比较值和类型。

像这样检查

if(password === "cat")

如果你想创建一个网络应用程序或其他东西,你的另一个查询。您应该使用PHP or WPF or any other like JSON等服务器端交互。

答案 1 :(得分:0)

这实际上是实现登录的错误方法。任何密码检查都必须在服务器上进行,否则密码将在客户端上可见,用户查看所需密码将是微不足道的。此外,请,请,请不要创建另一个用户名/密码登录...这是OAuth2旨在解决的问题;让身份专家处理登录,并简单地委托给另一个身份提供者。

话虽如此,你的代码中的错误是你使用单个等号(&#34; =&#34;)执行赋值,而你真的打算使用double equals(&#34; = =&#34;)或三等于(&#34; ===&#34;)进行比较。

答案 2 :(得分:0)

之前有很多人问过这个问题。代码需要对服务器使用Ajax请求。

此外,您确实需要服务器端语言来进行验证。像下面的例子,例子是使用Jquery库

HTML

<body>
 <?php session_start(); ?>
<div id="profile">
<?php if(isset($_SESSION['user_name'])){
?>
<a href='logout.php' id='logout'>Logout</a>
<?php }else {?>
<a id="login_a" href="#">login</a>
<?php } ?>
</div>
<div id="login_form">
<div class="err" id="add_err"></div>
<form action="login.php">
<label>User Name:</label>
<input type="text" id="user_name" name="user_name" />
<label>Password:</label>
<input type="password" id="password" name="password" />
<label></label><br/>
<input type="submit" id="login" value="Login" />
<input type="button" id="cancel_hide" value="Cancel" />
</form>
</div>
<div id="shadow" class="popup"></div>
</body>

的Javascript

<script type="text/javascript">
$(document).ready(function(){
$("#login_a").click(function(){
$("#shadow").fadeIn("normal");
$("#login_form").fadeIn("normal");
$("#user_name").focus();
});
$("#cancel_hide").click(function(){
$("#login_form").fadeOut("normal");
$("#shadow").fadeOut();
});
$("#login").click(function(){

username=$("#user_name").val();
password=$("#password").val();
$.ajax({
 type: "POST",
 url: "login.php",
 data: "name="+username+"&pwd="+password,
 success: function(html){
 if(html=='true')
 {
 $("#login_form").fadeOut("normal");
 $("#shadow").fadeOut();
 $("#profile").html("<a href='logout.php' id='logout'>Logout</a>");

 }
 else
 {
 $("#add_err").html("Wrong username or password");
 }
},
 beforeSend:function()
 {
 $("#add_err").html("Loading...")
 }
});
return false;
});
});
</script>

PHP代码

 <?php
  session_start();
 $username = $_POST['name'];
 $password = md5($_POST['pwd']);
 $mysqli=mysqli_connect('localhost','username','password','database');
 $query = "SELECT * FROM user WHERE username='$username' AND password='$password'";
 $result = mysqli_query($mysqli,$query)or die(mysqli_error());
 $num_row = mysqli_num_rows($result);
 $row=mysqli_fetch_array($result);
 if( $num_row >=1 ) {
  echo 'true';
  $_SESSION['user_name']=$row['username'];
 }
 else{
 echo 'false';
 }
?>