axios++,支持 缓存、截流、重试,响应结果去掉烦人的.data
- 合并相同的并发请求
- 失败重试
- 缓存响应成功的数据
- 优化 axios 返回值
pnpm add foca-axios
// File: http.ts
import { axios } from 'foca-axios';
export const http = axios;
import { axios } from 'foca-axios';
export const http = axios.create({
retry: false,
});
// [{id: 1, ...}]
await axios.get('/users');
// { data: [{id: 1, ...}], status: 200, ... }
await axios.get('/users').toRaw();
retry配置中提供了resolveUnauthorized
函数
当检测到401 unauthorized状态码,如果该函数返回true,则忽略 allowedMethods 和 allowedHttpStatus 的判断并继续重试。
注意:函数内的请求如果使用到GET等请求,建议在单个请求种手动关闭retry功能,以免出现死循环
const http = axios.create({
retry: {
async resolveUnauthorized(err) {
const result = await axios.post('/refresh/token', {...});
// 存储令牌,即将在 onAuthorized 中用到
saveToken(result.token);
// 代表已经解决授权问题,允许继续重试
return true;
},
onAuthorized(config) {
const token = getToken();
config.headers.Authorization = `Bearer ${token}`;
}
},
});