Flutter 中如何使用 Dio？-JavaScript中文网-JavaScript教程资源分享门户

本题详细解读

1. 添加依赖

在 Flutter 项目中使用 Dio 之前，首先需要在 pubspec.yaml 文件中添加 Dio 依赖。Dio 是一个强大的 Dart HTTP 客户端，支持拦截器、全局配置、FormData、请求取消、文件下载、超时等功能。

dependencies:
  dio: ^4.0.0

2. 导入包

在需要使用 Dio 的文件中，导入 Dio 包。

import 'package:dio/dio.dart';

3. 创建 Dio 实例

创建 Dio 实例时，可以通过 BaseOptions 配置基础 URL、超时时间等选项。这些配置将应用于所有通过该 Dio 实例发送的请求。

final dio = Dio(BaseOptions(
  baseUrl: 'https://jsonplaceholder.typicode.com',
  connectTimeout: 5000,
  receiveTimeout: 3000,
));

4. 发送请求

Dio 提供了多种请求方法，如 get、post、put、delete 等。以下是一个发送 GET 请求的示例：

Future<void> fetchData() async {
  try {
    final response = await dio.get('/posts');
    print(response.data);
  } catch (e) {
    print('Error: $e');
  }
}

5. 处理响应

Dio 的响应对象 Response 包含了请求的详细信息，如状态码、响应头、响应体等。可以通过 response.data 获取响应体数据。

final response = await dio.get('/posts');
print(response.statusCode); // 状态码
print(response.headers);    // 响应头
print(response.data);       // 响应体

6. 错误处理

Dio 提供了强大的错误处理机制。可以通过 try-catch 捕获异常，并根据异常类型进行不同的处理。

// www.javascriptcn.com code example
try {
  final response = await dio.get('/posts');
  print(response.data);
} on DioError catch (e) {
  if (e.response != null) {
    print(e.response.data);
    print(e.response.headers);
    print(e.response.requestOptions);
  } else {
    print(e.requestOptions);
    print(e.message);
  }
}

7. 拦截器

Dio 支持拦截器，可以在请求发送前或响应返回后进行一些操作。例如，添加请求头、打印日志等。

// www.javascriptcn.com code example
dio.interceptors.add(InterceptorsWrapper(
  onRequest: (options, handler) {
    options.headers['Authorization'] = 'Bearer token';
    return handler.next(options);
  },
  onResponse: (response, handler) {
    print('Response: ${response.data}');
    return handler.next(response);
  },
  onError: (DioError e, handler) {
    print('Error: $e');
    return handler.next(e);
  },
));

8. 文件上传与下载

Dio 支持文件上传和下载。以下是一个文件上传的示例：

FormData formData = FormData.fromMap({
  'file': await MultipartFile.fromFile('path/to/file', filename: 'upload.txt'),
});

final response = await dio.post('/upload', data: formData);
print(response.data);

9. 请求取消

Dio 支持请求取消功能，可以通过 CancelToken 取消正在进行的请求。

// www.javascriptcn.com code example
final cancelToken = CancelToken();

dio.get('/posts', cancelToken: cancelToken).then((response) {
  print(response.data);
}).catchError((e) {
  if (CancelToken.isCancel(e)) {
    print('Request canceled!');
  }
});

// 取消请求
cancelToken.cancel();

10. 全局配置

可以通过 Dio 的全局配置来设置默认的请求选项。

Dio dio = Dio();
dio.options.baseUrl = 'https://jsonplaceholder.typicode.com';
dio.options.connectTimeout = 5000;
dio.options.receiveTimeout = 3000;

通过以上步骤，你可以在 Flutter 项目中轻松使用 Dio 进行网络请求。

Flutter 中如何使用 Dio？

推荐答案