Flutter网络请求日志插件dio_logging_interceptor_v2的使用

Flutter网络请求日志插件dio_logging_interceptor_v2的使用

dio_logging_interceptor_v2 是一个用于 Dio 的拦截器,可以将 HTTP 请求和响应数据记录在调试控制台上。

使用

首先,确保你已经在项目中添加了 diodio_logging_interceptor_v2 依赖。在 pubspec.yaml 文件中添加以下内容:

dependencies:
  dio: ^5.0.0
  dio_logging_interceptor_v2: ^1.0.0

然后,你可以通过以下方式使用该插件:

import 'package:dio/dio.dart';
import 'package:dio_logging_interceptor_v2/dio_logging_interceptor_v2.dart';

void main() {
  final dio = Dio();

  // 添加日志拦截器
  dio.interceptors.add(
    DioLoggingInterceptor(
      level: Level.body, // 设置日志级别
      compact: false,    // 是否压缩日志
    ),
  );

  // 这里可以进行 HTTP 请求操作
}

示例输出

使用上述配置后,HTTP 请求和响应的日志会出现在调试控制台中。例如:

[DIO]--> POST http://localhost:9002/graphql
[DIO][HEADER]accept:*/*
[DIO][HEADER]content-type:application/json; charset=utf-8
[DIO][DATA]{
[DIO][DATA]  "operationName": "viewer",
[DIO][DATA]  "variables": {},
[DIO][DATA]  "query": "query viewer {\n  __typename\n  viewer {\n    __typename\n    id\n    username\n    firstName\n    lastName\n    email\n    password\n    phone\n    userStatus\n  }\n}"
[DIO][DATA]}
[DIO]--> END POST
[DIO]<-- 200 OK
[DIO][HEADER]connection:[keep-alive]
[DIO][HEADER]x-powered-by:[Express]
[DIO][HEADER]access-control-allow-credentials:[true]
[DIO][HEADER]keep-alive:[timeout=5]
[DIO][HEADER]date:[Sun, 15 Aug 2021 15:47:00 GMT]
[DIO][HEADER]vary:[Origin]
[DIO][HEADER]content-length:[249]
[DIO][HEADER]etag:[W/"f9-SBi3WV2NHnvyW3BEZe3/QHq1y3k"]
[DIO][HEADER]content-type:[application/json; charset=utf-8]
[DIO][DATA]{
[DIO][DATA]  "data": {
[DIO][DATA]    "__typename": "Query",
[DIO][DATA]    "viewer": {
[DIO][DATA]      "__typename": "User",
[DIO][DATA]      "id": "MTU2MjYyNjYzMQ==",
[DIO][DATA]      "username": "tan",
[DIO][DATA]      "firstName": "Georgiana",
[DIO][DATA]      "lastName": "Bosco",
[DIO][DATA]      "email": "Jamarcus4@hotmail.com",
[DIO][DATA]      "password": "7LpKbUQQeiQya8W",
[DIO][DATA]      "phone": "289.733.0250",
[DIO][DATA]      "userStatus": 10009
[DIO][DATA]    }
[DIO][DATA]  }
[DIO][DATA]}
[DIO]<-- END HTTP

更多关于Flutter网络请求日志插件dio_logging_interceptor_v2的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter网络请求日志插件dio_logging_interceptor_v2的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


dio_logging_interceptor_v2 是一个用于 Flutter 的 Dio 插件,它可以帮助你在进行网络请求时记录详细的日志信息。这个插件非常适合用于调试和监控网络请求,因为它可以记录请求和响应的详细信息,包括 URL、请求头、请求体、响应状态码、响应体等。

以下是如何在 Flutter 项目中使用 dio_logging_interceptor_v2 的步骤:

1. 添加依赖

首先,你需要在 pubspec.yaml 文件中添加 dio_logging_interceptor_v2 的依赖:

dependencies:
  flutter:
    sdk: flutter
  dio: ^4.0.0
  dio_logging_interceptor_v2: ^2.0.0

然后运行 flutter pub get 来安装依赖。

2. 创建 Dio 实例并添加拦截器

接下来,你需要在你的代码中创建一个 Dio 实例,并添加 DioLoggingInterceptor 作为拦截器。

import 'package:dio/dio.dart';
import 'package:dio_logging_interceptor_v2/dio_logging_interceptor_v2.dart';

void main() {
  Dio dio = Dio();

  // 添加日志拦截器
  dio.interceptors.add(DioLoggingInterceptor(
    level: Level.body, // 日志级别
    compact: false,    // 是否压缩日志
  ));

  // 发送请求
  dio.get('https://jsonplaceholder.typicode.com/posts/1').then((response) {
    print(response.data);
  }).catchError((error) {
    print(error);
  });
}

3. 配置日志级别

DioLoggingInterceptor 提供了不同的日志级别,你可以根据需要来配置:

  • Level.basic: 只记录基本的请求信息(URL、方法、状态码等)。
  • Level.headers: 记录请求和响应的头信息。
  • Level.body: 记录请求和响应的头信息及正文内容。

4. 发送网络请求

现在你可以使用 Dio 实例来发送网络请求,所有的请求和响应日志都会被记录下来。

dio.get('https://jsonplaceholder.typicode.com/posts/1').then((response) {
  print(response.data);
}).catchError((error) {
  print(error);
});

5. 查看日志

当你运行应用程序并发送网络请求时,你可以在控制台中看到详细的日志输出。例如:

--> GET https://jsonplaceholder.typicode.com/posts/1
Headers:
Content-Type: application/json
Accept: application/json
--> END GET

<-- 200 OK https://jsonplaceholder.typicode.com/posts/1
Headers:
content-type: application/json; charset=utf-8
cache-control: public, max-age=14400
...
Response:
{
  "userId": 1,
  "id": 1,
  "title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
  "body": "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas totam\nnostrum rerum est autem sunt rem eveniet architecto"
}
<-- END HTTP

6. 其他配置

你还可以通过 DioLoggingInterceptor 的其他参数来进一步配置日志输出,例如:

  • compact: 是否压缩日志输出,默认值为 false
  • requestHeader: 是否记录请求头,默认值为 true
  • requestBody: 是否记录请求体,默认值为 true
  • responseHeader: 是否记录响应头,默认值为 true
  • responseBody: 是否记录响应体,默认值为 true
dio.interceptors.add(DioLoggingInterceptor(
  level: Level.body,
  compact: true,
  requestHeader: true,
  requestBody: true,
  responseHeader: true,
  responseBody: true,
));
回到顶部