Flutter如何使用Dio实现缓存功能

在Flutter项目中，我想使用Dio库实现网络请求的缓存功能，但不太清楚具体该怎么做。能否详细说明如何配置Dio的缓存机制？比如如何设置缓存路径、缓存有效期，以及如何强制更新缓存？最好能提供完整的代码示例，谢谢！

2 回复

使用Dio实现缓存可通过dio_http_cache插件。安装后，在请求时设置缓存策略，如CachePolicy.forceCache强制缓存。也可自定义缓存时间与键值。

更多关于Flutter如何使用Dio实现缓存功能的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter中使用Dio实现缓存功能，可以通过以下步骤实现：

1. 添加依赖

在 pubspec.yaml 中添加：

dependencies:
  dio: ^5.0.0
  dio_cache_interceptor: ^4.0.0
  path_provider: ^2.0.0

2. 配置缓存拦截器

import 'package:dio/dio.dart';
import 'package:dio_cache_interceptor/dio_cache_interceptor.dart';
import 'package:path_provider/path_provider.dart';

Future<Dio> createCachedDio() async {
  final options = CacheOptions(
    store: MemCacheStore(), // 使用内存缓存（重启应用失效）
    // 持久化存储使用：
    // store: HiveCacheStore((await getTemporaryDirectory()).path),
    policy: CachePolicy.request, // 缓存策略
    hitCacheOnErrorExcept: [401, 403], // 错误时使用缓存（除401/403）
    maxStale: const Duration(days: 7), // 最大缓存时间
    priority: CachePriority.normal,
  );

  final dio = Dio();
  dio.interceptors.add(DioCacheInterceptor(options: options));
  return dio;
}

3. 发送请求时启用缓存

void fetchData() async {
  final dio = await createCachedDio();
  
  final response = await dio.get(
    'https://api.example.com/data',
    options: Options(
      extra: ContextOptions(
        cache: true, // 启用缓存
      ).toExtra(),
    ),
  );
  
  print(response.data);
}

4. 主要配置说明

  • 存储方式：
    • MemCacheStore：内存缓存
    • HiveCacheStore：持久化存储（推荐）
  • 缓存策略：
    • CachePolicy.request：总是使用缓存（适合静态数据）
    • CachePolicy.refresh：先返回缓存再请求更新
    • CachePolicy.refreshForce：强制刷新缓存

5. 清除缓存

// 清除特定URL缓存
await dio.delete(
  'https://api.example.com/data',
  options: Options(extra: {'source': 'cache'}),
);

// 清除所有缓存
await dio.interceptors
    .whereType<DioCacheInterceptor>()
    .first
    .store
    .clean();

这样即可实现完整的网络请求缓存功能，可根据需要调整缓存策略和存储方式。

回到顶部