问题背景:
项目中,在做前端请求,访问接口访问权限控制或登陆权限控制时,会用到token,而token会在一定时效性,而后端会在token失效后,生成新的token,返回前端进行暂存。而这时出现前端从,response返回中无法获取token的情况。
问题分析:
前端通过写一段请求response拦截器,发现response的header中没有token关键字。经过分析过后,发现是由于跨域访问的时候,前端是不能随意获取服务器响应头部,这时需要后端对响应header进行设置。
解决方法:
后端(java)发送请求的时候需要设置:Access-Control-Expose-Headers具体代码实现如下:
后端定义方式:
// 自定义响应头
ctx.res.setHeader('mytoken', 'abcefghijk'); //用于放置token内容
// 通过此header设置允许前端访问
ctx.res.setHeader('Access-Control-Expose-Headers', 'mytoken');
前端获取方式:
// 响应拦截
instance.interceptors.response.use(res => {
const { data, status } = res
if (res && res.headers && res.headers.mytoken){
store.commit('setMyToken',res.header[mytoken]) //将token放到store里或获取浏览器缓存中
}
return { data, status }
})