(一)React企业级后台（Axios/localstorage封装/动态侧边栏）

---

---

项目地址

• 教程作者：
• 教程地址：

• 代码仓库地址：

• 所用到的框架和插件：

dbt 
airflow

一、Axios和Localstorage封装

1.1 Axios封装

1.1 基础请求头

• 基础请求头只有最简单的头部，之后可以根据需求在RequestConfig里添加

1.2 后端返回结果和错误封装

• 根据后端的返回结果对响应进行统一的封装

// 基础响应类型定义（与后端统一）
export interface BaseResponse<T = any> {code: number; // 业务状态码：200成功，401未授权，403权限不足等data: T;      // 业务数据message: string; // 提示信息requestId?: string; // 请求唯一标识（用于问题排查）
}

• 错误请求的封装，如果后端已经将错误信息进行了统一处理，就不需要
  

1.3 requests的封装

• 请求的拦截器，添加jwt token，多租户的tenantId，以及traceID
  

1.4 response的封装

• 开发环境的traceID关联
• 业务状态码处理

  // 响应拦截器：关联traceIdinstance.interceptors.response.use((response: AxiosResponse<BaseResponse>) => {const { config, data } = response;const { url, method } = config;const traceId =