详解Flutter网络请求Dio库的使用及封装


Posted in Java/Android onApril 14, 2022

Dart语言内置的HttpClient实现了基本的网络请求相关的操作。但HttpClient本身功能较弱,很多网络请求常用功能都不支持,因此在实际项目中,我们更多是使用dio库实现网络请求。

注:Flutter官网同样推荐在项目中使用Dio库。

Dio文档地址: pub.dev地址:dio | Dart Package

一、项目目录结构

详解Flutter网络请求Dio库的使用及封装

文件夹 功能
components 放置全局共用组件
router 全局路由管理
service 管理接口请求并对返回数据进行处理,复杂功能逻辑处理
store provider全局状态管理
utile 工具类,例如:接口请求工具类,数据持久化工具类,加密解密工具类……
views 界面管理,实现界面UI绘制的代码逻辑

二、封装思路:

1、在DioRequest工具类中统一初始化网络请求常见配置,实现请求拦截器、响应拦截器以及错误处理。

2、统一在service中管理接口请求,并且对返回的数据根据实际需求进行处理,如果数据的修改需要更新UI或者需要全局共享该数据,可以结合provider实现。

三、添加依赖

在pubspec.yaml文件中添加所需要的第三方依赖库

dev_dependencies:
  flutter_test:
    sdk: flutter 
  # The "flutter_lints" package below contains a set of recommended lints to
  # encourage good coding practices. The lint set provided by the package is
  # activated in the `analysis_options.yaml` file located at the root of your
  # package. See that file for information about deactivating specific lint
  # rules and activating additional ones.
  flutter_lints: ^1.0.0
  # 数据请求
  dio: ^4.0.4

四、简单实现网络请求

utils目录中新建dio_request.dart文件实现DioRequest网络请求的工具类。

import 'package:dio/dio.dart';
/// dio网络请求配置表 自定义
class DioConfig {
  static const baseURL = 'http://117.34.71.31:8081/paas-admin'; //域名
  static const timeout = 10000; //超时时间
} 
// 网络请求工具类
class DioRequest {
  late Dio dio;
  static DioRequest? _instance;
  /// 构造函数
  DioRequest() {
    dio = Dio();
    dio.options = BaseOptions(
        baseUrl: DioConfig.baseURL,
        connectTimeout: DioConfig.timeout,
        sendTimeout: DioConfig.timeout,
        receiveTimeout: DioConfig.timeout,
        contentType: 'application/json; charset=utf-8',
        headers: {});
    /// 请求拦截器 and 响应拦截机 and 错误处理
    dio.interceptors.add(InterceptorsWrapper(onRequest: (options, handler) {
      print("\n================== 请求数据 ==========================");
      print("url = ${options.uri.toString()}");
      print("headers = ${options.headers}");
      print("params = ${options.data}");
      return handler.next(options);
    }, onResponse: (response, handler) {
      print("\n================== 响应数据 ==========================");
      print("code = ${response.statusCode}");
      print("data = ${response.data}");
      print("\n");
      handler.next(response);
    }, onError: (DioError e, handler) {
      print("\n================== 错误响应数据 ======================");
      print("type = ${e.type}");
      print("message = ${e.message}");
      print("\n");
      return handler.next(e);
    }));
  }
  static DioRequest getInstance() {
    return _instance ??= DioRequest();
  }
}

五、实现登录注册服务

lib下新建service目录,并在service目录中新建login.dart文件。

import 'dart:convert';

import 'package:cyber_security/utils/http.dart';

class LoginService {
  /// 获取用户数据中心列表
  static Future<List> getDataCenter() async {
    var response = await DioRequest.getInstance().dio.get('/getDataCenter');
    var data = jsonDecode(response.toString());
    return data['dataCenterList'];
  }

  /// 登录接口
  static login(value) async {
    var response = await DioRequest.getInstance()
        .dio
        .post('/sys/login', queryParameters: value);
    var data = jsonDecode(response.toString()); 
    /// 对返回的身份凭证全局持久化存储
    return data['key'];
  }

  /// 获取权限列表
  static menuNav() async {
    var response = await DioRequest.getInstance().dio.get('/sys/menu/nav');
    var data = jsonDecode(response.toString());
    return data['key'];
  }
}

六、使用service服务

@override
  void initState() {
    // TODO: implement initState
    super.initState();
    /// 请求用户数据中心数据
    LoginService.getDataCenter().then((value) {
      setState(() {
        _dataCenterList = value;
      });
    });
  }

到此这篇关于Flutter网络请求Dio库的使用及封装详解的文章就介绍到这了!

Java/Android 相关文章推荐
Springboot如何使用logback实现多环境配置?
Jun 16 Java/Android
SpringRetry重试框架的具体使用
Jul 25 Java/Android
JavaCV实现照片马赛克效果
Jan 22 Java/Android
使用HttpSessionListener监听器实战
Mar 17 Java/Android
springboot 自定义配置 解决Boolean属性不生效
Mar 18 Java/Android
Mybatis-Plus进阶分页与乐观锁插件及通用枚举和多数据源详解
Mar 21 Java/Android
Java 超详细讲解数据结构中的堆的应用
Apr 02 Java/Android
spring IOC容器的Bean管理XML自动装配过程
May 30 Java/Android
Java处理延时任务的常用几种解决方案
Jun 01 Java/Android
Spring Cloud OpenFeign模版化客户端
Jun 25 Java/Android
详解Spring Security如何在权限中使用通配符
Jun 28 Java/Android
Java获取字符串编码格式实现思路
Sep 23 Java/Android
详细介绍Java中的CyclicBarrier
Apr 13 #Java/Android
Java8 Stream API 提供了一种高效且易于使用的处理数据的方式
Apr 13 #Java/Android
Java的Object类的九种方法
Apr 13 #Java/Android
Java 使用类型为Object的变量指向任意类型的对象
Apr 13 #Java/Android
java中为什么说子类的构造方法默认访问的是父类的无参构造方法
Apr 13 #Java/Android
Spring Cloud Netflix 套件中的负载均衡组件 Ribbon
Apr 13 #Java/Android
Android开发之WECHAT微信小程序路由跳转的两种形式
Apr 12 #Java/Android
You might like
PHP取进制余数函数代码
2012/01/19 PHP
PHP遍历并打印指定目录下所有文件实例
2014/02/10 PHP
php中文繁体和简体相互转换的方法
2015/03/21 PHP
php中的抽象方法和抽象类
2017/02/14 PHP
用javascript实现的仿Flash广告图片轮换效果
2007/04/24 Javascript
jQuery中的bind绑定事件与文本框改变事件的临时解决方法
2010/08/13 Javascript
可在线编辑网页文字效果代码(单击)
2013/03/02 Javascript
js获取json元素数量的方法
2015/01/27 Javascript
详解js界面跳转与值传递
2016/11/22 Javascript
three.js实现围绕某物体旋转
2017/01/25 Javascript
ionic+AngularJs实现获取验证码倒计时按钮
2017/04/22 Javascript
vue小图标favicon不显示的解决方案
2017/09/19 Javascript
vue+iview 兼容IE11浏览器的实现方法
2019/01/07 Javascript
小试SVG之新手小白入门教程
2019/01/08 Javascript
electron+vue实现div contenteditable截图功能
2020/01/07 Javascript
Vue事件处理原理及过程详解
2020/03/11 Javascript
解决vue-router 切换tab标签关闭时缓存问题
2020/07/22 Javascript
JS中队列和双端队列实现及应用详解
2020/09/29 Javascript
python中单例常用的几种实现方法总结
2018/10/13 Python
python集合的创建、添加及删除操作示例
2019/10/08 Python
Python算法的时间复杂度和空间复杂度(实例解析)
2019/11/19 Python
pytorch之ImageFolder使用详解
2020/01/06 Python
Python 从attribute到property详解
2020/03/05 Python
Python实现AI换脸功能
2020/04/10 Python
Django:使用filter的pk进行多值查询操作
2020/07/15 Python
一文带你了解Python 四种常见基础爬虫方法介绍
2020/12/04 Python
美国女性奢华品牌精品店:INTERMIX
2017/10/12 全球购物
兰蔻法国官方网站:Lancôme法国
2020/02/22 全球购物
班级活动策划书
2014/02/06 职场文书
应聘护理专业毕业自荐书范文
2014/02/12 职场文书
创建市级文明单位实施方案
2014/03/01 职场文书
物业管理专业求职信
2014/06/11 职场文书
中国梦演讲稿5分钟
2014/08/19 职场文书
2015年统战工作总结
2015/05/19 职场文书
中考百日冲刺决心书
2015/09/22 职场文书
《小乌鸦爱妈妈》教学反思
2016/02/19 职场文书