使用RTK Query下载文件的最佳实践是什么？

安全阿岳

2026-7-30

RTK Query下载文件缓存问题的解决方案

方案一：继续使用Axios处理下载

完全可以保留Axios用于文件下载场景，这并非“倒退”，反而很务实——RTK Query的核心优势是数据状态管理与缓存，但文件下载这类不需要缓存、更侧重直接资源获取的场景，用你已经熟悉的Axios处理更顺手，不需要为了统一请求层而硬套RTK Query。你可以直接复用之前的Axios下载逻辑，比如处理Blob、创建下载链接等，没有任何技术障碍。

方案二：优化RTK Query避免缓存

如果希望统一用RTK Query管理所有请求，有几种方式可以规避浏览器缓存：

配置缓存过期策略：在定义查询时设置cacheTime: 0和keepUnusedDataFor: 0，让RTK Query不缓存该请求的结果，每次触发都会发起新请求：

const api = createApi({
  reducerPath: 'api',
  baseQuery: fetchBaseQuery({ baseUrl: '/' }),
  endpoints: (builder) => ({
    downloadFile: builder.query({
      query: (fileId) => `/files/${fileId}`,
      cacheTime: 0,
      keepUnusedDataFor: 0,
      transformResponse: (response) => response.blob(),
    }),
  }),
});

添加唯一请求参数：每次请求时附加一个随机数或时间戳作为查询参数，让浏览器识别为新请求，避免复用缓存：
```
query: (fileId) => `/files/${fileId}?_t=${Date.now()}`
```
设置请求头禁用缓存：在fetchBaseQuery的headers里添加Cache-Control: no-cache，强制浏览器不缓存响应：
```
baseQuery: fetchBaseQuery({
  baseUrl: '/',
  headers: {
    'Cache-Control': 'no-cache'
  }
})
```