当前位置：首页 > news >正文

怎么制作网站步骤网站做 app开发

news 2025/9/17 19:56:44

怎么制作网站步骤,网站做 app开发,广告公司网站主页设计,网站开发服务单位实现思路首次登录前端通过接口获取到两个 token；分别是 accessToken、refreshToken; accessToken：正常请求需要传递的 token ；refreshToken：当某个请求 401 ，就可以通过 refreshToken 获取到新的 accessToken 特殊场…

实现思路
1. 首次登录前端通过接口获取到两个 token；分别是 accessToken、refreshToken;
2. accessToken：正常请求需要传递的 token ；
3. refreshToken：当某个请求 401 ，就可以通过 refreshToken 获取到新的 accessToken
4. 特殊场景：如果 refreshToken 也过期了，那就默认跳回登录页，重新登录，就类似七天免登录的场景、过了第七天，refreshToken 也就过期了；

代码


import axios from "axios";
import { refreshToken } from "../api/index"; //刷新token的api
let isRefreshToken = false; //是否正在进行刷新token
let requestList = []; // 请求队列const request = axios.create({baseURL: "/api",timeout: 10000,
});// 请求拦截器
request.interceptors.request.use((config) => {let headerToken = localStorage.getItem("acc_token");// 设置请求头config.headers.Authorization = `Bearer ${headerToken}`;return config;},(error) => {// 请求错误时做些事return Promise.reject(error);}
);// 响应拦截器
request.interceptors.response.use(async (response) => {// 401 代表token过期，需要刷新tokenif (response.data.code == 401) {// 这里可以加入判断，判断 refreshToken 也过期了，直接 router.push 回登录页// if () {// router.push('/login')// }if (!isRefreshToken) {isRefreshToken = true;let res = await refreshToken(); // 刷新 token 的接口isRefreshToken = false;localStorage.setItem("acc_token", res.data.accToken);//   重发请求队列请求requestList.forEach((callback) => {callback();});requestList = [];let currentRequest = await request(response.config);return currentRequest;} else {// 将并发的请求，通过回调函数暂存起来，当token 刷新之后，在进行请求return new Promise((resolve) => {requestList.push(() => {resolve(request(response.config));});});}}return response;},(error) => {return Promise.reject(error);}
);export default request;

查看全文

http://www.yayakq.cn/news/706348/