在登陆请求成功以后,将token和id存起来,vit的session存没用,是框架自己封装的方法,看不懂的可以用seeeionStorage来存,我这里也是演示的这个,请求的时候我是使用将框架粉装的request
useLoginApi().signIn({
account: state.ruleForm.userName,
password: state.ruleForm.password,
}).then(async (result) => {
console.log(result);
state.loading.signIn = true;
// 存储 token 到浏览器缓存
// Session.set('token', Math.random().toString(36).substr(0));
sessionStorage.setItem('token', result.data.token)
sessionStorage.setItem('id', result.data.data.id)
// 模拟数据,对接接口时,记得删除多余代码及对应依赖的引入。用于 `/src/stores/userInfo.ts` 中不同用户登录判断(模拟数据)
Cookies.set('userName', state.ruleForm.userName);
if (!themeConfig.value.isRequestRoutes) {
// 前端控制路由,2、请注意执行顺序
const isNoPower = await initFrontEndControlRoutes();
signInSuccess(isNoPower);
} else {
// 模拟后端控制路由,isRequestRoutes 为 true,则开启后端控制路由
// 添加完动态路由,再进行 router 跳转,否则可能报错 No match found for location with path "/"
const isNoPower = await initBackEndControlRoutes();
// 执行完 initBackEndControlRoutes,再执行 signInSuccess
signInSuccess(isNoPower);
}
}).catch((err) => {
console.log(err);
});
存起来以后再去ruquest页面也就是框架封装好的请求拦截器里取出来去添加就好啦
// 添加请求拦截器
service.interceptors.request.use(
(config) => {
// 在发送请求之前做些什么 token
if (sessionStorage.getItem('token')) {
// console.log(sessionStorage.getItem('token'));
config.headers!['Authorization'] = `${Session.get('token')}`;
config.headers = {
token: sessionStorage.getItem('token'),
id: sessionStorage.getItem('id')
}
}
return config;
},
(error) => {
// 对请求错误做些什么
return Promise.reject(error);
}
);
需要token和id的公共参数都可以请求成功啦!