You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
116 lines
3.2 KiB
116 lines
3.2 KiB
9 years ago
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||
|
|
<title>Login Form</title>
|
||
|
|
<link rel="stylesheet" href="css/style.css">
|
||
|
|
<link rel="shortcut icon" type="image/png" href="https://avatars1.githubusercontent.com/u/17867603?v=3&s=200"/>
|
||
|
|
<script src="js/jquery-3.0.0.min.js"></script>
|
||
|
|
<!--[if lt IE 9]><script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
|
||
|
|
<style>
|
||
|
|
.flexCenter {
|
||
|
|
display:flex;
|
||
|
|
height: 550px;
|
||
|
|
justify-content: center;
|
||
|
|
align-items:center;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
|
||
|
|
|
||
|
|
<body>
|
||
|
|
<section id="boxlogin" class="container">
|
||
|
|
|
||
|
|
</section>
|
||
|
|
</body>
|
||
|
|
<script language="javascript">
|
||
|
|
|
||
|
|
var token = ''
|
||
|
|
|
||
|
|
function pasuser(form) {
|
||
|
|
var data = {"username": form.login.value, "password": form.password.value}
|
||
|
|
// console.log(form.login.value)
|
||
|
|
// console.log(form.password.value)
|
||
|
|
// console.log(data)
|
||
|
|
$.ajax({
|
||
|
|
type: "POST",
|
||
|
|
url: 'http://www.serv.stdb.most.go.th/api-token-auth/',
|
||
|
|
data: data,
|
||
|
|
success: success,
|
||
|
|
dataType: 'json'
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function success(respone) {
|
||
|
|
// console.log(respone)
|
||
|
|
// console.log(respone.token)
|
||
|
|
localStorage.setItem("token", respone.token);
|
||
|
|
getToken();
|
||
|
|
}
|
||
|
|
|
||
|
|
function getToken(){
|
||
|
|
sesToken = sessionStorage.getItem('token');
|
||
|
|
if( sesToken === null){
|
||
|
|
token = localStorage.getItem("token")
|
||
|
|
// console.log(token)
|
||
|
|
// console.log('==================')
|
||
|
|
if( token != null ){
|
||
|
|
$.ajax({
|
||
|
|
type: "POST",
|
||
|
|
url: 'http://www.serv.stdb.most.go.th/api-token-verify/',
|
||
|
|
data: { "token" : token },
|
||
|
|
header: {
|
||
|
|
Authorization: 'Bearer '+ token,
|
||
|
|
},
|
||
|
|
success: checkToken,
|
||
|
|
dataType: 'json'
|
||
|
|
});
|
||
|
|
}
|
||
|
|
else{
|
||
|
|
loginPage();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
else{
|
||
|
|
window.location.href = 'login.html';
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function checkToken(tokenrespone) {
|
||
|
|
sessionStorage.getItem('token',tokenrespone.token);
|
||
|
|
try {
|
||
|
|
if( tokenrespone.token === token ){
|
||
|
|
window.location.href = 'login.html';
|
||
|
|
// console.log('go to page');
|
||
|
|
// console.log(tokenrespone.token);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
catch(err) {
|
||
|
|
// console.log(err.message);
|
||
|
|
loginPage();
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
function loginPage(){
|
||
|
|
localStorage.removeItem('token');
|
||
|
|
var loginTag = '<div class="login">'
|
||
|
|
+'<h1>Login to STDB</h1>'
|
||
|
|
+'<form method="post" >'
|
||
|
|
+'<p><input type="text" name="login" value="" placeholder="Username or Email"></p>'
|
||
|
|
+'<p><input type="password" name="password" value="" placeholder="Password"></p>'
|
||
|
|
+'<p class="remember_me">'
|
||
|
|
+'<label>'
|
||
|
|
+'<input type="checkbox" name="remember_me" id="remember_me">'
|
||
|
|
+'Remember me on this computer'
|
||
|
|
+'</label>'
|
||
|
|
+'</p>'
|
||
|
|
+' <p class="submit"><input type="button" value="Login" onClick="pasuser(this.form)"></p>'
|
||
|
|
+'</form>'
|
||
|
|
+'</div>'
|
||
|
|
document.getElementById("boxlogin").innerHTML = loginTag
|
||
|
|
}
|
||
|
|
getToken()
|
||
|
|
</script>
|
||
|
|
</html>
|