周日没事干,去公司敲会代码~~~~~~~,O(∩_∩)O,学无止境,除了奋斗,别无选择!
需要下载一个base64.js插件,密码加密与解密
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
.wrap {
width: 300px;
margin: auto;
border: 1px solid red;
}
.wrap label {
display: block;
margin: 20px 0;
}
.wrap button {
display: block;
margin: auto;
}
</style>
</head>
<body>
<div class="wrap">
<label>
账号: <input id="username" type="text" placeholder="请输入用户名" name="" id="" value="" />
</label>
<label>
密码: <input id="password" type="password" placeholder="请输入密码" name="" id="" value="" />
</label>
<label>
<input id="rememberPassword" type="checkbox" name="" id="" value="" />记住密码
</label>
<button id="sub_btn" type="button">登录</button>
</div>
</body>
<script src="js/base64.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var username = document.getElementById("username");
var password = document.getElementById("password");
var rememberPassword = document.getElementById("rememberPassword");
var subBtn = document.getElementById("sub_btn");
// 首次加载判断是否记住密码
let user = localStorage.getItem("username");
let pass = localStorage.getItem("password");
let rember = localStorage.getItem("rememberPassword");
username.value = user; //记住用户名
if ( rember == "true") {
rememberPassword.checked = true;
password.value = Base64.decode(pass)
} else {
rememberPassword.checked = false;
}
subBtn.onclick = function() {
localStorage.setItem("username", username.value);
//是否记住密码
if (rememberPassword.checked) {
localStorage.setItem("password", Base64.encode(password.value));
localStorage.setItem("rememberPassword", rememberPassword.checked);
} else {
localStorage.setItem("password", '')
localStorage.setItem("rememberPassword", false);
}
var oStr = '';
var param = {};
param = {
"username": username.value,
"password": password.value,
"market_id": 330106001
};
//这里需要将json数据转成post能够进行提交的字符串 name1=value1&name2=value2格式
param = (function(value) {
for (var key in value) {
oStr += key + "=" + value[key] + "&";
};
return oStr;
}(param));
var xhr = new XMLHttpRequest();
xhr.open('post', '登录接口url');
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
console.log(param)
//发送请求
xhr.send(param);
xhr.onreadystatechange = function() {
// 这步为判断服务器是否正确响应
if (xhr.readyState == 4 && xhr.status == 200) {
var res = JSON.parse(xhr.responseText);
localStorage.setItem("token", res.token);
if (res.status == 1) {
alert(res.reason + ', 即将跳转......');
setInterval(function() {
window.location.href = 'home.html'
}, 1000)
} else{
alert(res.reason);
return false
}
}
};
}
</script>
</html>