ekonstantinidis ekonstantinidis - 5 months ago 39
Android Question

React Native & okhttp on Android - Set User-Agent

I'm trying to set the

User-Agent
with React Native on Android. Did some research and it looks like I should use an
okhttp
Interceptor. An example that I've found explains how this should be done(Link) but then I am not sure on how to register the Interceptor.

So in order to set the
User-Agent
I am using this class:

public class CustomInterceptor implements Interceptor {
@Override public Response intercept(Interceptor.Chain chain) throws IOException {
Request originalRequest = chain.request();
Request requestWithUserAgent = originalRequest.newBuilder()
.removeHeader("User-Agent")
.header("User-Agent", "Trevor")
.build();
return chain.proceed(requestWithUserAgent);
}
}


Then what's left is to register the above interceptor so where it should be done? Maybe in
MainActivity.java
?

OkHttpClient okHttp = new OkHttpClient();
okHttp.interceptors().add(new CustomInterceptor());


I am not getting any errors when building the app so I think that the
CustomInterceptor
should be fine - just need to make the app use it.

UPDATE:
I'm currently trying to register the interceptor in
MainActivity
but it won't pick it up:

public class MainActivity extends ReactActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);

OkHttpClient client = new OkHttpClient();
client.networkInterceptors().add(new CustomInterceptor());

};

};

Answer

So I've finally figured it out. Here is the solution for overriding the User-Agent of okhttp with React Native.

Create a file called CustomInterceptor.java:

package com.trevor;

import com.squareup.okhttp.Interceptor;
import com.squareup.okhttp.Request;
import com.squareup.okhttp.Response;

import java.io.IOException;

public class CustomInterceptor implements Interceptor {

    public CustomInterceptor() {}

    @Override
    public Response intercept(Interceptor.Chain chain) throws IOException {
        Request originalRequest = chain.request();
        Request requestWithUserAgent = originalRequest.newBuilder()
            .removeHeader("User-Agent")
            .addHeader("User-Agent", "Trevor")
            .build();

        return chain.proceed(requestWithUserAgent);
    }

}

Then in MainActivity.java override the onCreate method:

...
import com.facebook.react.modules.network.OkHttpClientProvider;
...

public class MainActivity extends ReactActivity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        attachInterceptor();
    }

    private void attachInterceptor() {
        OkHttpClient client = OkHttpClientProvider.getOkHttpClient();
        client.networkInterceptors().add(new CustomInterceptor());
    }
}

Note that I'm importing com.facebook.react.modules.network.OkHttpClientProvider; and overriding that client instead of creating a vanilla OkHttpClient since this is the one that React Native will use.

Comments