DEV Community

Peter Chege
Peter Chege

Posted on

Debug and inspect your network requests in android using the Chucker dev extension with Retrofit or Ktor Client

Introduction

Hello guys 👋👋, welcome back to another article, in our previous article we discussed
how to run migrations in android while also testing them .
In this article, we'll learn how to inspect and debug our network requests in android using the chucker dev extension

As an android developer, we normally usually interact with backend servers via REST APIs.Normally we use
http client libraries like Retrofit and Ktor client. The chucker dev extension gives us an interface that
can help us see all the information about all the requests and responses like the JSON payload and response status codes
etc. In this article we'll see how we can add the extension when using either Retrofit or Ktor client

Add the necessary dependencies

The chucker dev extension is available on GitHub

To start we'll add the necessary dependencies in our build.gradle.kts (App Module) as shown below


    dependencies {
        ... other dependencies
        debugImplementation ("com.github.chuckerteam.chucker:library:3.5.2")
        releaseImplementation ("com.github.chuckerteam.chucker:library-no-op:3.5.2")
    }


Enter fullscreen mode Exit fullscreen mode

The library has 2 variants namely a debug and release implementation. The release implementation is used to disable the
interface window
in production builds of your app so your users can not see the http activity associated with the given app.

After that, we'll proceed in 2 ways depending on the http client you are using

1. Retrofit

When using retrofit, we'll add the following interceptor to our Retrofit instance like shown below


    @Provides
    @Singleton
    fun provideHttpClient(@ApplicationContext context: Context): OkHttpClient {
        return OkHttpClient.Builder()
            .addInterceptor(
                ChuckerInterceptor.Builder(context = context)
                    .collector(ChuckerCollector(context = context))
                    .maxContentLength(length = 250000L)
                    .redactHeaders(headerNames = emptySet())
                    .alwaysReadResponseBody(enable = false)
                    .build()
            )
            .build()
    }

    @Provides
    @Singleton
    fun provideUserApi(
        client: OkHttpClient,
        networkJson:Json,
    ): BloggerApi {
        return Retrofit.Builder()
                .baseUrl(Constants.BASE_URL)
                .client(client)
                .addConverterFactory(
                networkJson.asConverterFactory("application/json".toMediaType()),
                )
                .build()
                .create(BloggerApi::class.java)
    }

Enter fullscreen mode Exit fullscreen mode

In the example above, we are creating an okhttp client that adds the chucker extension as an interceptor. We then provide
that client to the Retrofit instance. In the example above, I am using Dagger hilt

That's really it for installing it using Retrofit.
When you run your app, you should see a notification on your device that will log all different network requests that the
app makes as the user navigates through the app.

2. Ktor Client

To set up chucker using the ktor client,we'll first create http client factory like shown below

class HttpClientFactory {

    fun create(engine: HttpClientEngine) = HttpClient(engine) {

        install(ContentNegotiation) {
            json(
                Json {
                    prettyPrint = true
                    isLenient = true
                    ignoreUnknownKeys = true
                }
            )
        }

        install(DefaultRequest) {
            header(HttpHeaders.ContentType, ContentType.Application.Json)
            header("x-api-key",Constants.API_KEY)

        }

        expectSuccess = true
        addDefaultResponseValidation()
        if (BuildConfig.DEBUG) {
            install(Logging) {
                logger = Logger.DEFAULT
                level = LogLevel.ALL
            }
        }
    }
}
Enter fullscreen mode Exit fullscreen mode

Then we'll then add the following in our app's network Module


    @Provides
    @Singleton
    fun provideChuckerInterceptor(@ApplicationContext context: Context): ChuckerInterceptor {
        return ChuckerInterceptor.Builder(context)
            .collector(ChuckerCollector(context))
            .maxContentLength(250000L)
            .redactHeaders(emptySet())
            .alwaysReadResponseBody(false)
            .build()
    }

    @Provides
    @Singleton
    fun provideHttpClientEngine(chuckerInterceptor: ChuckerInterceptor): HttpClientEngine = OkHttp.create {
        addInterceptor(chuckerInterceptor)
    }


    @Provides
    @Singleton
    fun provideHttpClient(engine: HttpClientEngine): HttpClient = HttpClientFactory().create(engine)


Enter fullscreen mode Exit fullscreen mode

With that you're set to go.
When you run your app, you should see a notification recording all your http activity

I hope this helped you and made debugging your network requests easier

Top comments (0)