Question

我有一个登录表单和一个检查凭据的xhr

如果凭据正常，我会获得令牌，并希望将用户重定向到某个页面

这是表格

<form method="post" action="" class="login" onsubmit="getToken()"> {% csrf_token %}
<p>
  <label for="login">Username:</label>
  <input type="text" name="login" id="login" value="login">
</p>
<p>
  <label for="password">Password:</label>
  <input type="password" name="password" id="password" value="password">
</p>
<p class="login-submit">
  <button type="submit">Log in</button>
</p>

这是js：

function getToken(){
        document.cookie = "path=/; csrftoken = {% csrf_token %}";
        //alert($.cookie('csrftoken'));
        var xhr = new XMLHttpRequest();
        xhr.open('POST', 'api_url', false);
        xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
        xhr.setRequestHeader("X-CSRFToken", $.cookie('csrftoken'));
        xhr.send(JSON.stringify({"username":document.getElementById("login").value,
                    "password":document.getElementById("password").value}));
        if (xhr.status != 200) {
            alert( "Введите корректную комбинацию логина и пароля!" );

                    }
        else {
            alert( xhr.responseText );
            window.location.href = "http://www.google.com";
            document.cookie = "token = " + JSON.parse(xhr.responseText).key;
                }

}

然而，在成功登录后，我收到带有令牌的警报并设置了cookie，但页面只是刷新。

window.location.href = "http://www.google.com";

不起作用......

Answer 1

尝试从事件处理程序返回false以阻止默认表单提交：

<form method="post" action="" class="login" onsubmit="return getToken()">

然后在事件处理程序中返回false：

function getToken(){
   document.cookie = "path=/; csrftoken = {% csrf_token %}";
   //alert($.cookie('csrftoken'));
   var xhr = new XMLHttpRequest();
   xhr.open('POST', 'api_url', false);
   xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
   xhr.setRequestHeader("X-CSRFToken", $.cookie('csrftoken'));
   xhr.send(JSON.stringify({"username":document.getElementById("login").value, "password":document.getElementById("password").value}));
   if (xhr.status != 200) {
       alert( "Введите корректную комбинацию логина и пароля!" );
   } else {
       alert( xhr.responseText );
       window.location.href = "http://www.google.com";
       document.cookie = "token = " + JSON.parse(xhr.responseText).key;
   }
   return false;
}

Answer 2

你排除了xhr的一个相当大的部分..你需要{}电话或者什么都不会发生。

onreadystatechange

login.href成功登录后

2 个答案: