常用第三方库：dio网络库使用与封装

已于 2025-04-25 17:08:42 修改
阅读量1k 收藏 20
点赞数 39
分类专栏： Flutter开发系统化学习指南 文章标签： flutter android ios
于 2025-04-22 21:19:04 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wang295689649/article/details/147431213
版权

常用第三方库：dio网络库使用与封装

前言

dio是Flutter生态中最受欢迎的网络请求库之一，它提供了强大的功能和灵活的配置选项。本文将从实战角度深入介绍dio的使用技巧和最佳实践。

基础知识

1. dio简介

dio是一个强大的Dart Http请求库，支持Restful API、FormData、拦截器、请求取消、Cookie管理、文件上传/下载、超时等特性。

2. 基本使用

// 安装依赖
// pubspec.yaml
dependencies:
  dio: ^5.3.2

// 基本使用示例
import 'package:dio/dio.dart';

final dio = Dio();

// GET请求
Response response = await dio.get('https://api.example.com/users');

// POST请求
Response response = await dio.post(
  'https://api.example.com/users',
  data: {'name': 'test', 'age': 25},
);

3. 配置选项

final dio = Dio(BaseOptions(
  baseUrl: 'https://api.example.com',
  connectTimeout: Duration(seconds: 5),
  receiveTimeout: Duration(seconds: 3),
  headers: {
    'Authorization': 'Bearer token',
    'Content-Type': 'application/json',
  },
));

进阶特性

1. 拦截器

拦截器是dio的一大特色，可以在请求发起前和响应返回后进行统一处理。

class CustomInterceptor extends Interceptor {
  @override
  void onRequest(RequestOptions options, RequestInterceptorHandler handler) {
    // 在请求发起前统一添加token
    options.headers['Authorization'] = 'Bearer ${getToken()}';
    handler.next(options);
  }

  @override
  void onResponse(Response response, ResponseInterceptorHandler handler) {
    // 统一处理响应数据
    if (response.data['code'] == 0) {
      handler.next(response);
    } else {
      handler.reject(DioException(
        requestOptions: response.requestOptions,
        response: response,
        error: response.data['message'],
      ));
    }
  }

  @override
  void onError(DioException err, ErrorInterceptorHandler handler) {
    // 统一错误处理
    if (err.response?.statusCode == 401) {
      // 处理token过期
      refreshToken().then((newToken) {
        // 重试请求
        dio.fetch(err.requestOptions);
      });
    }
    handler.next(err);
  }
}

// 添加拦截器
dio.interceptors.add(CustomInterceptor());

2. 请求取消

// 创建取消令牌
final cancelToken = CancelToken();

// 发起请求
dio.get('https://api.example.com/data',
    cancelToken: cancelToken).then((response) {
  print(response.data);
}).catchError((error) {
  if (CancelToken.isCancel(error)) {
    print('请求被取消');
  }
});

// 取消请求
cancelToken.cancel('用户取消');

3. 文件上传下载

// 文件上传
FormData formData = FormData.fromMap({
  'file': await MultipartFile.fromFile(
    './text.txt',
    filename: 'text.txt',
  ),
});

Response response = await dio.post(
  '/upload',
  data: formData,
  onSendProgress: (int sent, int total) {
    print('上传进度：${sent / total}');
  },
);

// 文件下载
Response response = await dio.download(
  'https://example.com/file.pdf',
  './file.pdf',
  onReceiveProgress: (int received, int total) {
    print('下载进度：${received / total}');
  },
);

实战案例：网络请求封装

1. 统一的网络请求类

class HttpClient {
  static final HttpClient _instance = HttpClient._internal();
  late Dio dio;

  factory HttpClient() => _instance;

  HttpClient._internal() {
    dio = Dio(BaseOptions(
      baseUrl: 'https://api.example.com',
      connectTimeout: Duration(seconds: 5),
      receiveTimeout: Duration(seconds: 3),
    ));
    
    // 添加拦截器
    dio.interceptors.add(CustomInterceptor());
    
    // 添加缓存拦截器
    dio.interceptors.add(CacheInterceptor());
    
    // 添加重试拦截器
    dio.interceptors.add(
      RetryInterceptor(
        dio: dio,
        retries: 3,
        retryDelays: const [
          Duration(seconds: 1),
          Duration(seconds: 2),
          Duration(seconds: 3),
        ],
      ),
    );
  }

  Future<T> get<T>(
    String path, {
    Map<String, dynamic>? params,
    Options? options,
    CancelToken? cancelToken,
  }) async {
    try {
      final response = await dio.get(
        path,
        queryParameters: params,
        options: options,
        cancelToken: cancelToken,
      );
      return _handleResponse<T>(response);
    } catch (e) {
      return _handleError(e);
    }
  }

  Future<T> post<T>(
    String path, {
    dynamic data,
    Map<String, dynamic>? params,
    Options? options,
    CancelToken? cancelToken,
  }) async {
    try {
      final response = await dio.post(
        path,
        data: data,
        queryParameters: params,
        options: options,
        cancelToken: cancelToken,
      );
      return _handleResponse<T>(response);
    } catch (e) {
      return _handleError(e);
    }
  }

  T _handleResponse<T>(Response response) {
    if (response.data['code'] == 0) {
      return response.data['data'];
    } else {
      throw ApiException(
        code: response.data['code'],
        message: response.data['message'],
      );
    }
  }

  Never _handleError(dynamic error) {
    if (error is DioException) {
      switch (error.type) {
        case DioExceptionType.connectionTimeout:
          throw const ApiException(message: '连接超时');
        case DioExceptionType.sendTimeout:
          throw const ApiException(message: '请求超时');
        case DioExceptionType.receiveTimeout:
          throw const ApiException(message: '响应超时');
        case DioExceptionType.badResponse:
          throw ApiException(
            code: error.response?.statusCode,
            message: error.response?.statusMessage,
          );
        default:
          throw ApiException(message: error.message);
      }
    }
    throw ApiException(message: error.toString());
  }
}

2. 缓存拦截器实现

class CacheInterceptor extends Interceptor {
  final _cache = <String, Response>{};

  @override
  void onRequest(RequestOptions options, RequestInterceptorHandler handler) {
    // 只缓存GET请求
    if (options.method == 'GET') {
      final key = options.uri.toString();
      final cachedResponse = _cache[key];
      if (cachedResponse != null) {
        return handler.resolve(cachedResponse);
      }
    }
    handler.next(options);
  }

  @override
  void onResponse(Response response, ResponseInterceptorHandler handler) {
    // 缓存响应数据
    if (response.requestOptions.method == 'GET') {
      final key = response.requestOptions.uri.toString();
      _cache[key] = response;
    }
    handler.next(response);
  }
}

3. 使用示例

// API服务类
class UserService {
  final _http = HttpClient();

  Future<User> getUserInfo(String userId) async {
    final response = await _http.get<Map<String, dynamic>>(
      '/users/$userId',
    );
    return User.fromJson(response);
  }

  Future<List<User>> getUsers({int page = 1, int size = 20}) async {
    final response = await _http.get<List<dynamic>>(
      '/users',
      params: {'page': page, 'size': size},
    );
    return response.map((json) => User.fromJson(json)).toList();
  }

  Future<void> updateUser(String userId, Map<String, dynamic> data) async {
    await _http.post<void>(
      '/users/$userId',
      data: data,
    );
  }
}

性能优化建议

  1. 合理使用拦截器

    • 避免在拦截器中进行耗时操作
    • 使用异步操作时注意处理异常

  2. 请求优化

    • 合理设置超时时间
    • 使用cancelToken取消不必要的请求
    • 避免频繁的重复请求

  3. 缓存策略

    • 针对不常变化的数据实现缓存
    • 设置合理的缓存过期时间
    • 考虑使用本地存储持久化缓存

  4. 错误处理

    • 实现统一的错误处理机制
    • 合理使用重试机制
    • 提供友好的错误提示

常见问题解决

  1. 证书验证问题
// 忽略证书验证
dio.options.validateStatus = (status) {
  return status! < 500;
};

// 或者自定义证书验证
(dio.httpClientAdapter as IOHttpClientAdapter).onHttpClientCreate = 
  (HttpClient client) {
    client.badCertificateCallback =
        (X509Certificate cert, String host, int port) => true;
    return client;
  };
  1. 请求取消后的内存泄漏
// 在dispose时取消所有请求
final _cancelTokens = <CancelToken>[];

void addCancelToken(CancelToken token) {
  _cancelTokens.add(token);
}

@override
void dispose() {
  for (final token in _cancelTokens) {
    token.cancel();
  }
  _cancelTokens.clear();
  super.dispose();
}

面试题解析

1. dio与http package的区别是什么？

答：dio相比http package有以下优势：

  • 更强大的功能：支持拦截器、请求取消、文件上传下载进度监听等
  • 更好的扩展性：可以通过拦截器机制实现各种自定义功能
  • 更完善的错误处理：提供了统一的错误处理机制
  • 更方便的配置：支持全局配置和请求级配置
  • 更好的性能：支持请求队列、连接池等优化

2. 如何实现token失效自动刷新？

答：可以通过拦截器实现：

  1. 在响应拦截器中检测token失效（如401状态码）
  2. 调用刷新token的接口获取新token
  3. 使用新token重试原请求
  4. 注意处理并发请求的情况，避免多次刷新token
class TokenInterceptor extends Interceptor {
  bool _isRefreshing = false;
  List<RequestOptions> _pendingRequests = [];

  @override
  void onError(DioException err, ErrorInterceptorHandler handler) async {
    if (err.response?.statusCode == 401) {
      final options = err.requestOptions;
      
      if (!_isRefreshing) {
        _isRefreshing = true;
        try {
          final newToken = await refreshToken();
          // 更新所有等待的请求
          for (final request in _pendingRequests) {
            request.headers['Authorization'] = 'Bearer $newToken';
            dio.fetch(request);
          }
          _pendingRequests.clear();
        } finally {
          _isRefreshing = false;
        }
      } else {
        _pendingRequests.add(options);
      }
      return;
    }
    handler.next(err);
  }
}

3. dio如何处理大文件上传？

答：处理大文件上传需要注意以下几点：

  1. 使用FormData和MultipartFile处理文件上传
  2. 监听上传进度
  3. 实现断点续传
  4. 处理超时和错误重试
Future<void> uploadLargeFile(String filePath) async {
  final file = File(filePath);
  final fileSize = await file.length();
  
  // 创建FormData
  final formData = FormData.fromMap({
    'file': await MultipartFile.fromFile(
      filePath,
      filename: basename(filePath),
    ),
  });

  try {
    await dio.post(
      '/upload',
      data: formData,
      options: Options(
        headers: {
          Headers.contentLengthHeader: fileSize,
        },
        sendTimeout: Duration(minutes: 10),
      ),
      onSendProgress: (int sent, int total) {
        final progress = sent / total;
        print('上传进度：${(progress * 100).toStringAsFixed(2)}%');
      },
    );
  } catch (e) {
    // 处理错误，实现断点续传逻辑
  }
}

4. 如何优化dio的性能？

答：可以从以下几个方面优化dio的性能：

  1. 连接池优化

    • 合理设置maxConnectionsPerHost
    • 复用连接

  2. 请求优化

    • 使用适当的超时设置
    • 实现请求合并
    • 避免频繁创建dio实例

  3. 响应优化

    • 实现数据缓存
    • 使用压缩传输
    • 合理处理大量数据

  4. 内存优化

    • 及时释放不需要的资源
    • 避免内存泄漏
// 示例：请求合并优化
class RequestMerger {
  static final _instance = RequestMerger._();
  final _pending = <String, Completer<dynamic>>{};

  factory RequestMerger() => _instance;
  RequestMerger._();

  Future<T> request<T>(String url, Future<T> Function() fetcher) async {
    if (_pending.containsKey(url)) {
      return _pending[url]!.future as Future<T>;
    }

    final completer = Completer<T>();
    _pending[url] = completer;

    try {
      final result = await fetcher();
      completer.complete(result);
      return result;
    } catch (e) {
      completer.completeError(e);
      rethrow;
    } finally {
      _pending.remove(url);
    }
  }
}

总结

dio是一个功能强大且灵活的HTTP客户端库，通过合理的封装和优化，可以构建出一个健壮的网络请求层。本文介绍了dio的基本使用、进阶特性、实战案例和性能优化建议，希望能帮助读者更好地使用dio进行网络开发。

参考资源

  1. dio官方文档：https://pub.dev/packages/dio
  2. Flutter网络请求最佳实践：https://flutter.dev/docs/development/data-and-backend/networking
  3. dio源码：https://github.com/flutterchina/dio

如果你对文章内容有任何疑问或建议，欢迎在评论区留言交流。

flutter Dio网络请求最新封装（一）
智玲君
05-05 4225
前言 网络请求作为应用中必不可少的功能，是必须掌握的，在app中我们可能会书写大量的网络请求的操作，为了书写和维护方面的考虑，我们一般都会对网络请求进行封装，但是目前网上很多关于dio网络请求封装的示例个人感觉不是很清晰，比较难理解，因此专门自己重新封装了下，针对一些疑问在下面也做了详细注释，使用起来也很方便。 支持： 1，支持常用的网络请求GET,POST,PUT,DELETE等 2，统一的异常捕获，支持网络异常监听 3，支持get无参与两种有参的情况 4，支持post请求FormData表单提交以及普通
Flutter 笔记 | Flutter 文件IO、网络请求、JSON、日期与国际化
川峰的博客
05-29 1983
Flutter 笔记 | Flutter 文件IO、网络请求、JSON、日期与国际化，Flutter 笔记 | Flutter 文件IO、网络请求、JSON、日期与国际化Flutter 笔记 | Flutter 文件IO、网络请求、JSON、日期与国际化Flutter 笔记 | Flutter 文件IO、网络请求、JSON、日期与国际化Flutter 笔记 | Flutter 文件IO、网络请求、JSON、日期与国际化Flutter 笔记 | Flutter 文件IO、网络请求、JSON、日期与国际化Flu
常用第三方库精讲：dio网络库使用与封装
Ya-Jun 的博客
04-23 420
dio是一个强大的Dart Http请求库，支持Restful API、FormData、拦截器、请求取消、Cookie管理、文件上传/下载、超时等特性。dio是一个功能强大且灵活的HTTP客户端库，通过合理的封装和优化，可以构建出一个健壮的网络请求层。本文介绍了dio的基本使用、进阶特性、实战案例和性能优化建议，希望能帮助读者更好地使用dio进行网络开发。
Flutter网络请求Dio库的使用及封装
WEB前端李志杰
04-07 8516
主要介绍Flutter网络请求第三方库Dio并实现了对Dio的简单封装及使用。
Flutter常用第三方库及使用说明
qq_28510317的博客
04-29 1187
1、permission_handler：权限处理 staticconstList<PermissionGroup>values=<PermissionGroup>[ calendar, camera, contacts, location, locationAlways, locationWhenInUse, mediaLibrary, microphone, phone, ...
Flutter第三方库
飞落的眼泪的专栏
05-13 2468
状态管理MobX https://developer.school/flutter-state-management-with-mobx/ 格式化日期时间组件：https://pub.dev/packages/date_format 日期选择组件：https://pub.dev/packages/flutter_cupertino_date_picker 轮播图组件：https://pub.dev/packages/flutter_swiper showToast(弹窗提示)：https://pub.dev
Flutter项目第三方链接梳理
fuweng886的博客
02-19 167
1：下来刷新上啦加载更多，flutter_easyrefresh package - All Versions
Flutter常用三方库
xymspace
10-27 610
在pubsepc.yaml中添加组件依赖 > dependencies: 安装依赖 pub get 或者 flutter packages get 或者 vsCode中保存配置自动下载 import ‘package: …’ dio 一个强大的dart http请求库 flutter_swiper 轮播组件，可以适配Android和iOS shared_preferences 数据本地化存储 ...
Dio使用
fyq520521的博客
08-04 1984
封装时，要传递的参数除了 queryParameters外，data参数也需要传，如果服务器需要请求体，那么data参数要转换一下 json.encode(queryParameters), dio dio是一个强大的Dart Http请求库，支持Restful API、FormData、拦截器、请求取消、Cookie管理、文件上传/下载、超时、自定义适配器等... 添加依赖 dependencies: dio: ^4.0.0 如果你是dio 3.x 用户，想了解4.0的变.
Flutter开发常用第三方插件持续更新，不重复造轮子
wayne214的博客
05-20 868
2020.5.20整理 Bilibili开源的视频播放组件,fijkplayr 是基于 ijkplayer 封装的 flutter 媒体播放器，开箱即用，无需编译 ijkplayer fijkplayer 加载动画库 flutter_spinkit 网络请求库,dio是一个强大的Dart Http请求库，支持Restful API、FormData、拦截器、请求取消、Cookie管理、文件上传/下载、超时、自定义适配器等… Dio 图片缓存框架 cached_network_image 轮播组件,flutt
Flutter 基于 dio 和 http 两种网络库的基础封装
02-12
在 Flutter 开发中，...总结来说，dio 和 http 都是 Flutter 开发中常用的网络库，各有优势。dio 功能强大且灵活，适合复杂场景；http 简单易用，适用于轻量级需求。正确封装网络库，能提升开发效率，降低维护成本。
Flutter网络请求封装：HttpClient、http与Dio对比
本文将详细介绍Flutter中常用的三种网络请求方式：Dart原生的HttpClient、第三方库http以及流行的Dio库，以帮助开发者更高效地进行网络通信。 首先，Dart原生的HttpClient是基础网络请求方式，其使用过程包括以下...
在Flutter中集成第三方库与插件
接下来我们将介绍在Flutter项目中集成第三方库的常见方式，包括配置依赖关系与版本控制，以及使用第三方库的基本步骤与注意事项。 #### 3.1 在Flutter项目中引入第三方库的常见方式 在Flutter项目中，我们可以通过...
Dart令牌刷新库：Fresh - HTTP请求的Dart语言解决方案
4. oauth oauth2：OAuth是一种开放标准，允许用户授权第三方应用访问他们存储在其他服务提供者上的信息，而无需将用户名和密码提供给第三方应用。OAuth 2.0是其第二版，专为Web应用、桌面应用、移动应用及设备定义了...
Flutter 环境搭建
ioSugar
04-23 745
再重新运行但是还是报相同的错误,使用Xcode工程现在是可以运行在手机上,所以问题应该是出在Flutter驱动Xcode的过程，因为跨平台。我的环境是macOS + iOS,所以选择了参考1的文档，下载了flutter_macos_3.29.3-stable.zip。选择iPhone(13.4.1)时报错了,看错误是证书问题,用Xcode打开Flutter里的Xcode工程。文档中要WIFI调试,这点目前不关键,然后iPhone Xcode相关的配置文档中也已经详细的写了。启动系统会弹2个告警的弹窗。
Flutter 在全新 Platform 和 UI 线程合并后，出现了什么大坑和变化？
恋猫de小郭的博客
04-24 507
因为 Flutter Engine 不会直接控制线程的创建和销毁，而是通过控制任务队列的调度来间接影响线程的行为，通过合并任务队列，Engine 就可以让多个线程执行的任务集中到一个线程上，从而达到合并线程的作用。所以可以看到，增加启动线程的核心就是用原本的 Dart UI 线程进行启动，然后启动完成把任务队列合并到平台线程，回归平台线程的逻辑。而在启动之后，Dart 的主线程就会移动到平台线程，虽然说是“移动线程”，但是通过上面的代码我们可以看到，实际上就是将两个任务队列。
flutter 小知识
weixin_43575775的博客
04-24 179
‌‌是中的一个特殊布局小部件，它允许子组件的尺寸基于父组件的尺寸来计算。这意味着子组件的尺寸是父组件尺寸的一个比例，这使得布局在不同屏幕尺寸下保持一致性‌1。
[flutter]切换国内源（window）
最新发布
ZhuAiQuan的博客
04-24 94
变量值：https://storage.flutter-io.cn。如题，切换到国内源避免总是连不上google导致卡住的问题。变量值：https://pub.flutter-io.cn。变量名：FLUTTER_STORAGE_BASE_URL。变量名：PUB_HOSTED_URL。继续打开cmd验证是否添加正常，输入。打开系统信息 选择高级系统设置。这样就可以切换到国内源上来了。添加完之后点确定关闭这3个弹窗。
Flutter之路由和导航
zouyang920的博客
04-23 159
Flutter 提供了一个完整的系统，用于在屏幕之间导航和处理 深层链接。没有复杂深度链接的小型应用程序可以使用 Navigator，而具有特定深度链接和导航的应用程序 要求还应该使用 Router 来正确处理 Android 和 iOS，并在应用程序运行时与地址栏保持同步 在 Web 上运行。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

键盘魔术师小码哥

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值