chuck_interceptor 2.2.4 copy "chuck_interceptor: ^2.2.4" to clipboard
chuck_interceptor: ^2.2.4 copied to clipboard

Chuck is an HTTP Inspector tool which helps debugging http requests. It catches and stores http requests and responses, which can be viewed via simple UI.

Chuck #

ChuckInterceptor is an HTTP Inspector tool for Flutter which helps debugging http requests. It catches and stores http requests and responses, which can be viewed via simple UI. It is inspired from Chuck and Chucker.

Supported Dart http client plugins:

  • Dio
  • HttpClient from dart:io package
  • Http from http/http package

Features:
✔️ Detailed logs for each HTTP calls (HTTP Request, HTTP Response)
✔️ Inspector UI for viewing HTTP calls
✔️ Save HTTP calls to file
✔️ Statistics
✔️ Notification on HTTP call
✔️ Support for top used HTTP clients in Dart
✔️ Error handling
✔️ Shake to open inspector
✔️ HTTP calls search

Install #

  1. Add this to your pubspec.yaml file:
dependencies:
  chuck_interceptor: ^2.1.4
copied to clipboard
  1. Install it
$ flutter packages get
copied to clipboard
  1. Import it
import 'package:chuck_interceptor/chuck.dart';
copied to clipboard

Usage #

Chuck configuration #

  1. Create chuck instance:
Chuck chuck = Chuck();
copied to clipboard
  1. Add navigator key to your application:
MaterialApp( navigatorKey: chuck.getNavigatorKey(), home: ...)
copied to clipboard

You need to add this navigator key in order to show inspector UI. You can use also your navigator key in Chuck:

Chuck chuck = Chuck(showNotification: true, navigatorKey: yourNavigatorKeyHere);
copied to clipboard

If you need to pass navigatorKey lazily, you can use:

chuck.setNavigatorKey(yourNavigatorKeyHere);
copied to clipboard

This is minimal configuration required to run Chuck. Can set optional settings in Chuck constructor, which are presented below. If you don't want to change anything, you can move to Http clients configuration.

Additional settings #

You can set showNotification in Chuck constructor to show notification. Clicking on this notification will open inspector.

Chuck chuck = Chuck(..., showNotification: true);
copied to clipboard

You can set showInspectorOnShake in Chuck constructor to open inspector by shaking your device (default disabled):

Chuck chuck = Chuck(..., showInspectorOnShake: true);
copied to clipboard

If you want to use dark mode just add darkTheme flag:

Chuck chuck = Chuck(..., darkTheme: true);
copied to clipboard

If you want to pass another notification icon, you can use notificationIcon parameter. Default value is @mipmap/ic_launcher.

Chuck chuck = Chuck(..., notificationIcon: "myNotificationIconResourceName");
copied to clipboard

If you want to limit max numbers of HTTP calls saved in memory, you may use maxCallsCount parameter.

Chuck chuck = Chuck(..., maxCallsCount: 1000));
copied to clipboard

If you want to change the Directionality of Chuck, you can use the directionality parameter. If the parameter is set to null, the Directionality of the app will be used.

Chuck chuck = Chuck(..., directionality: TextDirection.ltr);
copied to clipboard

HTTP Client configuration #

If you're using Dio, you just need to add interceptor.

Dio dio = Dio();
dio.interceptors.add(chuck.getDioInterceptor());
copied to clipboard

If you're using HttpClient from dart:io package:

httpClient
	.getUrl(Uri.parse("https://jsonplaceholder.typicode.com/posts"))
	.then((request) async {
		Chuck.onHttpClientRequest(request);
		var httpResponse = await request.close();
		var responseBody = await httpResponse.transform(utf8.decoder).join();
		chuck.onHttpClientResponse(httpResponse, request, body: responseBody);
 });
copied to clipboard

If you're using http from http/http package:

http.get('https://jsonplaceholder.typicode.com/posts').then((response) {
    chuck.onHttpResponse(response);
});
copied to clipboard

If you're using Chopper. you need to add interceptor:

chopper = ChopperClient(
    interceptors: chuck.getChopperInterceptor(),
);
copied to clipboard

If you have other HTTP client you can use generic http call interface:

ChuckHttpCall chuckHttpCall = ChuckHttpCall(id);
chuck.addHttpCall(ChuckHttpCall);
copied to clipboard

Show inspector manually #

You may need that if you won't use shake or notification:

chuck.showInspector();
copied to clipboard

Saving calls #

Chuck supports saving logs to your mobile device storage. In order to make save feature works, you need to add in your Android application manifest:

<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
copied to clipboard

Extensions #

You can use extensions to shorten your http and http client code. This is optional, but may improve your codebase. Example:

  1. Import:
import 'package:chuck_interceptor/chuck.dart';
copied to clipboard
  1. Use extensions:
http
    .post('https://jsonplaceholder.typicode.com/posts', body: body)
    .interceptWithChuck(Chuck, body: body);
copied to clipboard
httpClient
    .postUrl(Uri.parse("https://jsonplaceholder.typicode.com/posts"))
    .interceptWithChuck(chuck, body: body, headers: Map());
copied to clipboard

Example #

See complete example here: https://github.com/SunnatilloShavkatov/chuck_interceptor/blob/master/example/lib/main.dart To run project, you need to call this command in your terminal:

flutter pub run build_runner build --delete-conflicting-outputs
copied to clipboard

69
likes
150
points
7.49k
downloads

Publisher

unverified uploader

Weekly Downloads

2024.09.14 - 2025.03.29

Chuck is an HTTP Inspector tool which helps debugging http requests. It catches and stores http requests and responses, which can be viewed via simple UI.

Repository (GitHub)

Documentation

API reference

License

Apache-2.0 (license)

Dependencies

dio, flutter, flutter_local_notifications, http, package_info_plus, path_provider, permission_handler, rxdart, share_plus

More

Packages that depend on chuck_interceptor