DEV Community

Farhan Roy -- | 😁
Farhan Roy -- | 😁

Posted on

Flutter Dio Interceptor

Terkadang dalam membuat aplikasi kita perlu mengetahui data request yang dikirim ke server guna memastikan apakah data yang dikirim apakah betul.

Hal ini bisa dilakukan dengan tracing menggunakan Interceptor pada package Dio. Interceptor sendiri merupakan suatu mekanisme yang digunakan untuk memodifikasi request sebelum dikirim dan response sebelum diterima. Fitur ini sangat berguna bagi developer dalam mengirimkan request dengan header khusus atau juga mengambil data pada setiap response yang diterima.

Ada beberapa jenis interceptor, pada kasus ini interceptor yang dipakai adalah DioLoggingInterceptor. Berikut langkah - langkah penggunaannya:

  1. Pastikan project sudah menggunakan package Dio, lalu buat kelas baru yang berisi seperti berikut


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

class LoggingInterceptor extends Interceptor {
  @override
  void onResponse(Response response, ResponseInterceptorHandler handler) {
    super.onResponse(response, handler);
    debugPrint('\n\n');
    debugPrint('<--- HTTP CODE : ${response.statusCode} URL : ${response.requestOptions.baseUrl}${response.requestOptions.path}');
    debugPrint('Headers: ');
    printWrapped('Response : ${response.data}');
    debugPrint('<--- END HTTP');
  }

  void printWrapped(String text) {
    final RegExp pattern = RegExp('.{1,800}');
    pattern.allMatches(text).forEach((RegExpMatch match) => debugPrint(match.group(0)));
  }
}


Enter fullscreen mode Exit fullscreen mode
  1. Kemudian tinggal mentautkan dengan objek Dio-nya


final dio = Dio();

dio.interceptors.add(LoggingInterceptor());


Enter fullscreen mode Exit fullscreen mode

Setelah itu pada saat running akan mendapatkan output seperti ini

Image description

Top comments (0)