鸿蒙应用开发中的Axios网络请求封装实践

1. 鸿蒙网络请求封装的必要性

在鸿蒙应用开发中，网络请求是与后端服务交互的核心环节。直接使用原生Http模块存在几个明显痛点：重复编写基础配置、错误处理分散、缺乏统一拦截机制。我在多个商业项目中发现，未经封装的网络层代码通常会膨胀到难以维护的程度。

Axios作为前端领域广泛采用的HTTP客户端，其拦截器、请求/响应转换等特性恰好能解决这些问题。但鸿蒙的TypeScript/JavaScript运行时与浏览器环境存在差异，需要针对性适配。上周帮团队Review代码时，就发现三个不同模块各自实现了token刷新逻辑——这正是缺乏统一封装导致的典型问题。

2. 基础封装架构设计

2.1 核心模块划分

完整的封装方案应包含以下层次：

• 配置层（BaseConfig）：超时时间、基础URL等静态配置
• 实例层（RequestClient）：创建axios实例并注入配置
• 拦截层（Interceptor）：请求/响应拦截器管道
• 业务层（Service）：具体API接口声明

typescript复制// 典型目录结构
src/
  network/
    config.ts      // 基础配置
    request.ts     // 封装实例
    interceptors/  // 拦截器模块
      request.ts
      response.ts
      error.ts
    services/      // 业务API
      user.api.ts
      product.api.ts

2.2 多环境配置方案

商业项目通常需要区分开发/测试/生产环境。建议采用环境变量+配置文件的方式：

typescript复制// config.ts
const env = process.env.APP_ENV || 'development'

const envConfig = {
  development: {
    baseURL: 'http://dev.example.com',
    timeout: 15000
  },
  production: {
    baseURL: 'https://api.example.com',
    timeout: 10000
  }
}

export default envConfig[env]

3. 拦截器深度实现

3.1 请求拦截器黄金组合

typescript复制// interceptors/request.ts
export const requestInterceptor = (config: AxiosRequestConfig) => {
  // 1. 自动注入token
  const token = AppStorage.get('token')
  if (t