EXP-3.3

拦截器机制

beforeRequest / afterResponse 完整流程

请求拦截器机制

演示完整的拦截器链路：beforeRequest（请求前）添加 Header、注入 Cookie/Token； afterResponse（响应后）记录日志、处理错误、验证数据。对比 unifiedScenario（提取业务数据）与 envelopeScenario（响应包络）的差异。

拦截器执行流程

beforeRequest注入 Header/Token

HTTP 请求发送至服务端

afterResponse日志/错误/验证

拦截器处理提取 data / 转换错误

响应处理模式:

成功响应 (拦截后)

拦截器自动提取 data 字段，直接返回业务数据

POST/api/example/request/scenario

业务错误 (拦截后)

拦截器将错误响应转换为 BusinessError 抛出

POST/api/example/request/scenario

拦截器配置代码

beforeRequest — 请求前处理

hooks: {
  beforeRequest: [
    // 注入 x-customer-id Cookie
    async ({ request }) => {
      request.headers.set('x-customer-id', cookieValue)
    },
    // 注入 Authorization Token
    async ({ request }) => {
      request.headers.set('Authorization', `Bearer ${token}`)
    },
    // 请求日志
    async ({ request }) => {
      console.log('[Request]', request.method, request.url)
    },
  ]
}

afterResponse — 响应后处理

hooks: {
  afterResponse: [
    // 响应日志
    async ({ response }) => {
      console.log('[Response]', response.status, response.statusText)
      return response
    },
    // 错误处理
    async ({ options, response, retryCount }) => {
      if (!response.ok) {
        // retry 未耗尽时交回请求库继续重试
        if (shouldWaitForRetry(options.method || 'GET', response.status, retryCount, options.retry)) {
          return response
        }
        // 401 自动跳转（可通过 skipAuthRedirect 禁用）
        if (response.status === 401 && !options.context?.skipAuthRedirect) {
          window.location.href = '/login'
        }
        createErrorResponse({ url, method, status, statusText }, null, options)
      }
      return response
    },
  ]
}