Flutter网络日志打印插件pretty_dio_logger的使用

发布于 1周前 作者 yuanlaile 来自 Flutter

Flutter网络日志打印插件pretty_dio_logger的使用

pretty_dio_logger简介

Pub

pretty_dio_logger 是一个用于 Dio 的拦截器，它以美观、易于阅读的格式记录网络请求。

使用方法

只需要将 PrettyDioLogger 添加到你的 Dio 拦截器中即可。你可以根据需要进行一些定制化配置，例如是否打印请求头、请求体、响应头、响应体等信息，以及是否在调试模式下启用日志打印等功能。

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

void main() async {
  final dio = Dio()
    ..interceptors.add(
      PrettyDioLogger(
        requestHeader: true, // 是否打印请求头
        requestBody: true,   // 是否打印请求体
        responseBody: true,  // 是否打印响应体
        responseHeader: false, // 是否打印响应头
        error: true,         // 是否打印错误信息
        compact: true,       // 紧凑模式
        maxWidth: 90,        // 每行最大宽度
        enabled: kDebugMode, // 只在debug模式下启用
        filter: (options, args) {
          // 不打印包含'/posts'路径的请求
          if (options.path.contains('/posts')) {
            return false;
          }
          // 不打印包含Uint8List数据类型的响应
          return !args.isResponse || !args.hasUint8ListData;
        },
      ),
    );

  try {
    await dio.get('https://jsonplaceholder.typicode.com/posts/1');
  } catch (e) {
    print(e);
  }
}

日志显示效果

VS Code

Android Studio

通过以上介绍，相信你已经了解了如何在Flutter项目中使用pretty_dio_logger来打印美观的日志信息。如果你有任何问题或建议，欢迎随时留言交流！


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

Harmonyos Next教程
1 回复

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


当然，下面是一个关于如何在Flutter项目中使用pretty_dio_logger插件来进行网络日志打印的示例代码。pretty_dio_logger是一个用于美化并打印Dio请求的日志的Flutter插件。

步骤 1: 添加依赖

首先，在你的pubspec.yaml文件中添加pretty_dio_logger和dio的依赖：

dependencies:
  flutter:
    sdk: flutter
  dio: ^4.0.4  # 请确保使用最新版本
  pretty_dio_logger: ^1.2.0  # 请确保使用最新版本

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

步骤 2: 配置Dio实例

接下来，在你的项目中配置Dio实例并使用pretty_dio_logger进行日志打印。

import 'package:flutter/material.dart';
import 'package:dio/dio.dart';
import 'package:pretty_dio_logger/pretty_dio_logger.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Pretty Dio Logger Example'),
        ),
        body: Center(
          child: MyHomePage(),
        ),
      ),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  void initState() {
    super.initState();
    setUpDio();
  }

  void setUpDio() {
    // 创建Dio实例
    final Dio dio = Dio();

    // 配置PrettyDioLogger
    dio.interceptors.add(
      PrettyDioLogger(
        requestHeader: true,
        requestBody: true,
        responseBody: true,
        responseHeader: false,
        compact: false,
        error: true,
      ),
    );

    // 示例请求
    dio.get('https://jsonplaceholder.typicode.com/posts/1')
      .then((response) {
        print('Response Data: ${response.data}');
      })
      .catchError((error) {
        print('Error: ${error.message}');
      });
  }

  @override
  Widget build(BuildContext context) {
    return Text('Check your console for network logs.');
  }
}

解释

  1. 添加依赖：在pubspec.yaml文件中添加了dio和pretty_dio_logger的依赖。
  2. 配置Dio实例：在setUpDio方法中，我们创建了一个Dio实例，并添加了PrettyDioLogger拦截器。PrettyDioLogger的构造函数参数可以自定义日志的输出内容，例如是否打印请求头、请求体、响应体等。
  3. 发送请求：通过dio.get方法发送了一个GET请求，请求的URL是https://jsonplaceholder.typicode.com/posts/1。请求成功后，打印响应数据；请求失败时，打印错误信息。

日志输出示例

运行上述代码后，控制台将输出类似如下的日志信息（根据PrettyDioLogger的配置，日志内容可能有所不同）：

-- REQUEST ----
GET /posts/1 HTTP/1.1
Host: jsonplaceholder.typicode.com
Connection: keep-alive
Accept-Encoding: gzip, deflate
User-Agent: dio/4.0.4 (Dart/2.15.1 linux_x64)

-- RESPONSE ----
HTTP/1.1 200 OK
Connection: keep-alive
Content-Length: 849
Content-Type: application/json; charset=utf-8
Date: Wed, 09 Mar 2022 08:34:56 GMT
ETag: W/"351-1760780173"
X-Powered-By: Express

{
  "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"
}

这样，你就可以在控制台中看到美化后的网络请求和响应日志了。

回到顶部