Flask JWT Extended-access_token(header)和refresh_token(httpOnly cookie)的不同位置

Question

如何配置扩展了flask jwt的flask应用程序，我们需要以下内容。

1. AccessToken/Bearer必须作为Header(而不是cookie(发送
2. RefreshToken必须仅作为/api/RefreshToken路径的httpOnlyCookie发送

如何设置两个不同的令牌，一个在标头中，另一个在cookie中？我们可以将两者都设置为cookie，也可以将两者设置为标头。

有什么帮助吗？

谢谢Raxit

Answer 1

我想在构建React+Flask单页应用程序时也这样做，因为我是一个初学者，在经历了几天的头痛之后，我试图理解授权和身份验证。

无论如何，我设法做到了这一点：

在烧瓶中，配置：

app.config['JWT_TOKEN_LOCATION'] = ['headers', 'cookies']
app.config['JWT_REFRESH_COOKIE_PATH'] = '/auth/refresh'

我在登录功能中返回的内容：

resp = jsonify({'access_token': access_token})
set_refresh_cookies(resp, refresh_token)
return resp, 200

在我的刷新功能中：

# Refresh access token
@app.route('/auth/refresh', methods=['POST'])
@jwt_refresh_token_required
def refresh():
user = get_jwt_identity()
resp = {
'access_token': create_access_token(
identity={
'username': user['username'],
'role': user['role']
},
expires_delta=timedelta(seconds=600),
user_claims=user['role']
)
}
return jsonify(resp), 200

在前端，我收集JSON access_token并将其设置在内存中，并使用withCredentials通过API调用发送refresh_token。

axios.defaults.withCredentials = true;
axios.defaults.headers.common['Authorization'] = `Bearer ${access_token}`;

更准确地说：

.then(({ data: { access_token } }) => {
axiosHttp.defaults.headers.common['Authorization'] = `Bearer ${access_token}`;
return jwt_decode(access_token);
})

然后我在React上下文组件中使用来自解码的access_token的数据来根据角色验证对页面的访问。

登出只是将我的上下文设置为null，并调用api来取消设置刷新cookie

@app.route('/auth/logout', methods=['DELETE'])
@jwt_required
def logout():
resp = jsonify({"msg": "Successfully logged out"})
unset_jwt_cookies(resp)
return resp, 200

这最终很简单，但我花了很长时间才弄明白！