Skip to main content

Network Plugin Setup

To use the network plugin, you need to add the plugin to your Flipper client instance.

Android#

The network plugin is shipped as a separate Maven artifact:

dependencies {  debugImplementation 'com.facebook.flipper:flipper-network-plugin:0.101.0'}

Once added to your dependencies, you can instantiate the plugin and add it to the client:

import com.facebook.flipper.plugins.network.NetworkFlipperPlugin;
NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();new NetworkingModule.CustomClientBuilder() {    @Override    public void apply(OkHttpClient.Builder builder) {        builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));    }});client.addPlugin(networkFlipperPlugin);

OkHttp Integration#

If you are using the popular OkHttp library, you can use the Interceptors system to automatically hook into your existing stack.

import com.facebook.flipper.plugins.network.FlipperOkhttpInterceptor;
new OkHttpClient.Builder()    .addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin))    .build();

As interceptors can modify the request and response, add the Flipper interceptor after all others to get an accurate view of the network traffic.

Protobuf / Retrofit Integration#

If you are using Retrofit with Protobuf request or response types, you can setup automatic decoding so that the network inspector can display a human readable payload. First you must add the separate dependency:

dependencies {  debugImplementation 'com.facebook.flipper:flipper-retrofit2-protobuf-plugin:0.91.2'}

Then call SendProtobufToFlipperFromRetrofit for each service class.

import com.facebook.flipper.plugins.retrofit2protobuf.SendProtobufToFlipperFromRetrofit
SendProtobufToFlipperFromRetrofit("https://baseurl.com/", MyApiService::class.java)

iOS#

To enable network inspection, add the following pod to your Podfile:

pod 'FlipperKit/SKIOSNetworkPlugin', '~>' + flipperkit_version

Initialise the plugin in the following way by updating AppDelegate.m:

#import <FlipperKitNetworkPlugin/FlipperKitNetworkPlugin.h>
[[FlipperClient sharedClient] addPlugin: [[FlipperKitNetworkPlugin alloc] initWithNetworkAdapter:[SKIOSNetworkAdapter new]]];

Protobut + Retrofit Setup#

Gradle Dependencies#

Ensure that you already have an explicit dependency in your application's build.gradle including the plugin dependency, e.g.

dependencies {  implementation "com.squareup.retrofit2:retrofit:2.9.0"  implementation "com.squareup.retrofit2:converter-protobuf:2.9.0"    // update version below to match latest Flipper client app  debugImplementation "com.facebook.flipper:flipper-retrofit2-protobuf-plugin:0.84.0"}

Sending Retrofit Service#

Suppose you have a Retrofit service interface PersonService which has Protobuf body or return types. At the time you create your implementation, call the plugin with your baseUrl and service class:

import com.facebook.flipper.plugins.retrofit2protobuf.SendProtobufToFlipperFromRetrofit...val personService = retrofit.create(PersonService::class.java)SendProtobufToFlipperFromRetrofit(baseUrl, PersonService::class.java)