PcReDiveRankTableFrontend/login.html
Raymond Yang 105391ae13 加入web
2023-07-10 15:36:47 +08:00

67 lines
2.0 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html
lang="zh-TW"
xmlns="http://www.w3.org/1999/html"
xmlns="http://www.w3.org/1999/html"
>
<head>
<!-- Required meta tags -->
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>登入</title>
</head>
<body>
<form id="login-form">
<p><input type="text" id="username" placeholder="Username" /></p>
<p>
<input
type="password"
id="password"
placeholder="Password"
autocomplete="true"
/>
</p>
<p><button type="submit">Login</button></p>
</form>
<script src="https://cdn.jsdelivr.net/npm/axios@1.1.2/dist/axios.min.js"></script>
<script language="javascript" type="text/javascript">
document
.getElementById("login-form")
.addEventListener("submit", function (event) {
event.preventDefault(); // 阻止表单的默认提交行为
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
// 执行登录请求
login(username, password);
});
function login(username, password) {
// 发送登录请求
axios
.post("./api/v1/login", {
account: username,
password: password,
})
.then(function (response) {
var token = response.data.token; // 假设服务器返回一个名为"token"的字段
// 将JWT存储到本地通常是使用localStorage
localStorage.setItem("jwtToken", token);
// 登录成功后,进行其他操作(例如重定向到受保护的页面)
window.location.href = "./index.html";
})
.catch(function (error) {
const message = error.response.data.message;
alert("登入失敗");
//console.error('登入失敗:', error);
});
}
</script>
</body>
</html>