前端代码
import importlib
import os
from flask import Flask, url_for, request, render_template
app = Flask(__name__)
app.jinja_env.auto_reload = True
app.config['TEMPLATES_AUTO_RELOAD'] = True
html = """
<html>
<body>
<div id="main-box"></div>
<script src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js"></script>
<script>
function setCookie(name, value, days) { //设置cookie
var d = new Date();
d.setTime(d.getTime() + (days * 24 * 60 * 60 * 1000));
var expires = "expires=" + d.toUTCString();
document.cookie = name + "=" + value + "; " + expires;
}
</script>
<script>
//登陆按钮函数
function on_btn_login_clicked(event){
var username = document.getElementById('input-username').value;
var password = document.getElementById('input-password').value;
$.ajax({
url:'http://127.0.0.1:9999/account/login',
type:'POST',
xhrFields: {
withCredentials: true
},
crossDomain: true,
contentType: "application/json;charset=utf-8",
data:JSON.stringify({"username":username,"password":password}),
dataType: "JSON",
success:function(data){
if(data.status_code==400){
alert(data.status_msg)
}else if(data.status_code==200){
//登陆成功，将token存入cookie
setCookie('token',data.token,7 )
}
},
error:function(data){
alert('请求失败');
}
})
window.location.reload();
}
</script>
<script>
//token自动登陆
function verify_token(token){
var res = false;
$.ajax({
async:false,//切换为同步请求的方式获取返回值
url:'http://127.0.0.1:9999/account/verify_token',
type:'POST',
contentType: "application/json;charset=utf-8",
data:JSON.stringify({"token":token}),
dataType: "JSON",
success:function(data){
if(data.status_code==200){
res= true;
}else if(data.status_code==400){
res= false;
}
},
error:function(data){
res= false;
}
})
return res;
}
function get_token(){
//cookie的格式 key1=value1;key2=value2...
for (e of document.cookie.split(';')){
var key = e.split('=')[0];
var value = e.split('=')[1];
if (key==='token'){
return value;
}
}
return null;
}
var main_box = document.getElementById('main-box')
var token = get_token();
if(token && verify_token(token)){
//alert('登陆成功')
//如果存在token，发送到服务器验证有效性，如果有效，显示登陆后的界面
main_box.innerHTML = 'token is '+ token +',已登录';
}else{
main_box.innerHTML = '<div>请登录</div><input type="text" id="input-username" placeholder="账号"><input type="text" id="input-password" placeholder="密码"><button onclick="on_btn_login_clicked(event)">登陆</button>';
}
</script>
</body>
</html>
"""
@app.route('/')
def index():
return html
if __name__ == '__main__':
app.run(port=9998)
后端代码
from flask import Flask, request, jsonify
from flask_cors import CORS # 跨域请求插件 https://www.cnblogs.com/cwp-bg/p/9256892.html
app = Flask(__name__)
CORS(app, supports_credentials=True) # 允许跨域请求
app.jinja_env.auto_reload = True
app.config['TEMPLATES_AUTO_RELOAD'] = True
account_db = {
'test': '123456',
}
redis = {}
@app.after_request
def after_request(response_):
"""
#请求钩子，在所有的请求发生后执行，加入headers。
:param response_:
:return:
"""
# response_ = make_response(response_)
response_.headers['Access-Control-Allow-Origin'] = 'http://127.0.0.1:9998' # 设置为'*'浏览器将不会发送cookies数据
response_.headers['Access-Control-Allow-Methods'] = 'GET,POST'
response_.headers['Access-Control-Allow-Headers'] = 'x-requested-with,content-type'
response_.headers['Access-Control-Allow-Credentials'] = 'true' # 是否允许后续请求携带认证信息（cookies）
# print(response_.__class__)
return response_
def is_valid_account(username, password):
return username in account_db and account_db[username] == password
def is_valid_token(token):
username = token[:-16]
return username in redis and redis[username] == token
def make_token(username):
# 加密后的token，包含用户名信息,每次登陆都会更新token
return username + 'suijizifuchuan16'
def save_token_to_redis(username, token):
redis[username] = token
@app.route('/account/login', methods=['POST'])
def account_login():
# 验证账号密码
# print(request.cookies) #测试获取cookies
data = request.json
username = data['username']
password = data['password']
if is_valid_account(username, password):
token = make_token(username) # 每次登陆都会更新token
save_token_to_redis(username, token)
return jsonify({'status_code': 200, 'status_msg': '登陆成功', 'token': token})
else:
return jsonify({'status_code': 400, 'status_msg': '登陆失败'})
@app.route('/account/verify_token', methods=['POST'])
def verify_token():
data = request.json
token = data['token']
if is_valid_token(token):
# 延长token有效期
return jsonify({'status_code': 200, 'status_msg': 'token有效'})
else:
return jsonify({'status_code': 400, 'status_msg': 'token无效'})
if __name__ == '__main__':
app.run(port=9999)
网友评论