Flutter学习-24-三方库Dio的使用和封装

这是我参与11月更文挑战的第22天，活动详情查看：2021最后一次更文挑战。

1. Dio的使用

我们之前网络请求使用的是系统的http，我们看下三方的网络请求 dio

使用的人比较多，而且有中文文档，国内的大神写的。 dio是一个强大的Dart Http请求库，支持Restful API、FormData、拦截器、请求取消、Cookie管理、文件上传/下载、超时、自定义适配器等...

使用

dependencies:
dio: ^4.0.3
复制代码

我们之前的微信项目使用的http请求，我们使用dio请求

async {
  final url = Uri.parse('http://rap2api.taobao.org/app/mock/293940/home/chat/list');
  var dio = Dio();
 var dioResponse = await dio.getUri(url);
 print(dioResponse.statusCode);
 print(dioResponse.data);
 }
复制代码

这里不用我们自己json转字典，直接就返回了字典。我们可以可以直接传入一个url字符串地址进行请求。

我们替换下之前的请求

async {
  final url = Uri.parse('http://rap2api.taobao.org/app/mock/293940/home/chat/list');
  var dio = Dio();
 var dioResponse = await dio.getUri(url);
  if(dioResponse.statusCode == 200){
    var listData = dioResponse.data['data'];

   List<ChatModel> data = listData.map<ChatModel>((item) => ChatModel.formMap(item)).toList();
   return data;

}else{
  throw Exception('respose code is = ${dioResponse.statusCode}');
}
复制代码

post

post 请求类似，参数放在data里面，

我们自定义一个post接口

testPostRequest(){

 Future(() async {

   var response = await Dio().post('http://rap2api.taobao.org/app/mock/293940/friend/contact/list',data:{'id':'1'} );

   print(response.data);

 });
}
复制代码

dio.download下载

我们打开腾讯课堂，选择下载链接

void main() {
  //发送网络请求下载
  //1.创建dio 对象
  final dio = Dio();
  //2.下载数据
  var downloadUrl =
      'https://edu-files-1251502357.cos.ap-shanghai.myqcloud.com/CourseTeacher_2.8.1.13_DailyBuild.dmg';
  String savePath = '/Users/hg/Desktop/testDownload/腾讯课堂.dmg';
  download1(dio, downloadUrl, savePath);
}
download1(Dio dio, String url, savePath) {
  dio
      .download(url, savePath, onReceiveProgress: showDownloadProgress)
      .then((value) => print(value))
      .whenComplete(() => print('结束了'))
      .catchError((e) => print(e));
}
复制代码

展示进度通过onReceiveProgress

void showDownloadProgress(int count, int total) {
  if (total != -1) {
    print((count / total * 100).toStringAsFixed(0) + '%');
  }
}
复制代码

下载结束后

我们在客户端的话

void download2(Dio dio, String url, String savePath) {
  //手机端
  String iOSPath = Directory.systemTemp.path + '/腾讯课堂.dmg';
  print(iOSPath);
  dio
      .download(url, (header) {
    return iOSPath;
  }, onReceiveProgress: showDownloadProgress)
      .whenComplete(() => print('完成'))
      .catchError((e) => print(e));
}
复制代码

查看下载结果上传的话类似，可以看下官方的demo

2. 网络请求的封装

一般我们使用的时候都会进行自己的封装定义一个Dio的单列

 //定义一个单列
static Dio?  _dioShareInstance;

static Dio _getDio(){
  
  _dioShareInstance??= Dio();

  return _dioShareInstance!;
}
复制代码

我们内部实现，根据请求的方式使用dio单列不同的请求

static Future _sendRequest(RequstType type,String url,{Map<String ,dynamic>? queryParameters,dynamic data}) async {

  try{
    switch(type){
      case RequstType.GET:
        return await  HttpRequstManager._getDio().get(url,queryParameters: queryParameters);

      case RequstType.POST:
        return await HttpRequstManager._getDio()
            .post(url, queryParameters: queryParameters, data: data);
      default:
        throw Exception('请求方式错误');
    }

  } on DioError catch(error){
    print(error.message);
  } on Exception catch(error){
    print(error.toString());
  }


  return null;
}
复制代码

我们在外部暴漏出来静态方法提供调用

//返回我们自己的Response
static Future<Response> get(String url,
    {Map<String, dynamic>? queryParameters}) async {
  return await _sendRequest(RequstType.GET, url,
      queryParameters: queryParameters);
}

static Future<Response> post(String url,
    {Map<String, dynamic>? queryParameters, dynamic data}) async {
  return await _sendRequest(RequstType.POST, url,
      queryParameters: queryParameters, data: data);
}
复制代码

我们在之前的项目中使用

 final response = await HttpRequstManager.get('http://rap2api.taobao.org/app/mock/293940/home/chat/list');
  if(response.statusCode == 200){
    var map =response.data;
    var listData = map['data'];
   List<ChatModel> data = listData.map<ChatModel>((item) => ChatModel.formMap(item)).toList();
   return data;

}else{
  throw Exception('respose code is = ${response.statusCode}');
}
复制代码

Flutter学习-24-三方库Dio的使用和封装

1. Dio的使用

2. 网络请求的封装

猜你喜欢