vue+flask前后端分离解决csrf token问题

是攻击者通过跨站请求，以合法的用户身份进行非法 *** 作（如转账或发帖等）。CSRF的原理是利用浏览器的Cookie或服务器的Session，盗取用户身份

防范CSRF的主要手段是识别请求者的身份，通过在表单中添加令牌（token）。

前后端分离实现过程：

后端写入令牌

为了能够让所有的视图函数受到 CSRF 保护，需要开启 CsrfProtect 模块:

生成token值并利用请求钩子设置cookie，然后前端就能获取到cookie值

在前端请求时带上 csrf_token 值

根据登录和注册的业务逻辑，当前采用的是 ajax 请求

所以在提交登录或者注册请求时，需要在请求头中添加 X-CSRFToken 的键值对

原文链接： https://blog.csdn.net/paul0926/article/details/94544048

在前后端完全分离的情况下，Vue项目中实现token验证大致思路如下：

1、用户输入账号密码，前端调后端的登陆接口，发送用户名和密码，

2、后端收到请求，验证用户名和密码，验证通过后（即登录成功），后端返回token给前端；

3、前端拿到token，将token存储到localStorage和vuex中，并跳转路由页面；

4、前端每次跳转路由，都要判断 localStroage 中有无 token ，没有就跳转到登录页面，有则跳转到对应路由页面（ 通过router.beforeEach((to, from, next)=>{.....}）)

5、每次调后端接口，都要在请求头中加上token；

6、后端判断请求头中有无token，有token，就拿到token并验证token，验证成功就返回数据，验证失败（例如：token过期）就返回编码401（编码由前台和后台约定好），请求头中没有token也返回编码401；

7、如果前端拿到状态码为401，则清除token信息并跳转到登录页面，并d框提示用户当前缺少token或者token已失效，请重新登录；

一、调登录接口成功，在回调函数中将token存储到localStorage和vuex中

login.vue

store文件夹下的index.js

二、路由导航守卫

main.js

三、请求头加token，如果前端拿到状态码为401，就清除token信息并跳转到登录页面

前言

有些登录不是用cookie来验证的，是用token参数来判断是否登录。

token传参有两种一种是放在请求头里，本质上是跟cookie是一样的，只是换个单词而已；另外一种是在url请求参数里，这种更直观。

一、登录返回token

1.如下图的这个登录，无cookies

2.但是登录成功后有返回token

二、请求头带token

1.登录成功后继续 *** 作其它页面，发现post请求的请求头，都会带token参数

2.这种请求其实比cookie更简单，直接把登录后的token放到头部就行

三、token关联

1.用脚本实现登录，获取token参数，获取后传参到请求头就可以了

2.如果登录有验证码，前面的脚本登录步骤就省略了，自己手动登录后获取token

import requests

header = { # 登录抓包获取的头部

"User-Agent": "Mozilla/5.0 (Windows NT 10.0WOW64rv:44.0) Gecko/20100101 Firefox/44.0",

"Accept": " / ",

"Accept-Language": "zh-CN,zhq=0.8,en-USq=0.5,enq=0.3",

"Accept-Encoding": "gzip, deflate",

"Content-Type": "application/x-www-form-urlencodedcharset=UTF-8",

"X-Requested-With": "XMLHttpRequest",

"Content-Length": "423",

"Connection": "keep-alive"

}

body = {"key1": "value1",

"key2": "value2"} # 这里账号密码就是抓包的数据

s = requests.session()

login_url = " http://xxx.login " #　自己找带token网址

login_ret = s.post(login_url, headers=header, data=body)

token = login_ret.json()["token"]

post_url = " http://xxx "

header["token"] = token

header["Content-Length"]="9"

body1 = {

"key": "value"

}

post_ret = s.post(post_url, headers=header, data=body1)

print post_ret.content

---