我有一个html文件，在其中创建了一些输入字段，从这些字段中我收集了用户的电子邮件和密码。然后，我将这些值传递给javascript文件。我正在使用addEventListener()来检测单击登录按钮。在addEventListener()内部，我调用另一个函数，该函数基本上使用XMLHttpRequest()将API请求发送到后端服务器。但是似乎请求未发送到服务器。这是我的代码：
index.html
<html>
<script src="index.js"></script>
<label>Email :</label>
<input type="text" name="email" id="email" />
<br /><br />
<label>Password :</label>
<input type="password" name="password" id="password" />
<br /><br />
<button type="submit" id="login">Login</button>
</html>
index.js
document.addEventListener("DOMContentLoaded",function() {
var signin_btn = document.getElementById("login");
signin_btn.addEventListener("click",function() {
validate();
});
});
function validate() {
console.log("validate running.");
var username = document.getElementById("email").value;
var password = document.getElementById("password").value;
console.log("username: ",username);
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
auth_token = JSON.parse(this.responseText)["token"];
localStorage.setItem("auth_token",auth_token);
console.log("auth from index.js: ",auth_token);
}
xhttp.open("POST","http://127.0.0.1:5000/userauth/login",true);
xhttp.setRequestHeader("Content-Type","application/json");
xhttp.send(JSON.stringify({ email: username,password: password }));
};
}
运行此代码时，控制台中仅显示console.log("username: ",username);部分。但是console.log("auth from index.js: ",auth_token);不显示。似乎请求根本没有被执行。后端也不会显示任何错误。有什么问题吗？