Network Console #

A comprehensive network consoling kit for Dio and Http with unified logging and a built-in on-device UI viewer.

Features #

• 🚀 Unified Logging: Inspect traffic from both dio and http in the same format.
• 📱 In-App Viewer: View network logs directly on your device screen without connecting to a debugger.
• 🆔 Request Tracking: Automatically tags every request with a unique 8-character UUID to match responses easily.
• ⏰ Precise Timing: Logs exact timestamps and calculates request duration (latency) in milliseconds.
• 🎨 Readable Output: Color-coded console logs with icons (🚀 Request, ✅ Response, ❌ Error) for quick debugging.

Installation #

Add this to your pubspec.yaml:

dependencies:
  network_console: ^0.0.4

Usage #

Import the package in your Dart code:

import 'package:network_console/network_console.dart';

Scenario A: Using Dio #

Simply add the NetworkConsoleDio interceptor to your Dio instance.

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

void main() async {
  final dio = Dio();
  
  // Add the inspector
  dio.interceptors.add(NetworkConsoleDio());

  // Make requests as usual
  await dio.get('https://jsonplaceholder.typicode.com/todos/');
}

Scenario B: Using Http #

Use the NetworkConsoleHttp wrapper client instead of the standard http methods.

import 'package:http/http.dart' as http;
import 'package:network_console/network_console.dart';

void main() async {
  // Initialize the wrapper client
  final client = NetworkConsoleHttp();

  // Make requests
  await client.get(Uri.parse('https://jsonplaceholder.typicode.com/todos/'));
  
  // Clean up
  client.close();
}

Scenario C: Viewing Logs (UI) #

You can open the console logs screen anywhere in your app (e.g., from a hidden debug button or settings menu).

import 'package:flutter/material.dart';
import 'package:network_console/network_console.dart';

// ... inside your widget ...
ElevatedButton(
  onPressed: () {
    Navigator.push(
      context,
      MaterialPageRoute(
        builder: (context) => const NetworkConsoleLogs(),
      ),
    );
  },
  child: const Text("Open Network Console"),
)

License #

This project is licensed under the MIT License - see the LICENSE file for details.