React-native: NetworkingModule no longer uses custom OkHttpClient - breaking Stetho/other interceptors

[codebymikey]

Description

On Android, it is no longer possible to set the OkHttpClient used in NetworkingModule. This was previously working before the 0a71f48b1349ed09bcb6e76ba9ff8eb388518b15 commit was made.

Reproduction Steps and Sample Code

In your MainApplication.java, replace the default OkHttpClient. The NetworkingModule no longer uses it, but instead creates its own instance.

// MainApplication.java

  @Override
  public void onCreate() {
    super.onCreate();
    SoLoader.init(this, /* native exopackage */ false);
    // https://medium.com/@andr3wjack/stetho-with-react-native-87642e5d7131#.oc293ztbx
    OkHttpClient client = OkHttpClientProvider.getOkHttpClient()
            .newBuilder()
            .addNetworkInterceptor(new StethoInterceptor())
            .build();

    OkHttpClientProvider.replaceOkHttpClient(client);
  }

Solution

Potential solution is available here:
https://github.com/facebook/react-native/commit/0a71f48b1349ed09bcb6e76ba9ff8eb388518b15#commitcomment-22015300

To avoid unnecessary clicking:

What if we add an interface that allows users to provide their own OkHttpClient based on the context. Something similar to:

// com/facebook/react/modules/network/OkHttpClientProvider.java
//...

interface OkHttpClientProvider {
  OkHttpClient createNewNetworkModuleClient();
}

// Public setter for setting this.
static OkHttpClientProvider provider;

public static OkHttpClient createClient() {
    if(provider != null) {
      // Use a user defined provider.
      return provider.createNewNetworkModuleClient();
    }
    // No timeouts by default
    OkHttpClient.Builder client = new OkHttpClient.Builder()
      .connectTimeout(0, TimeUnit.MILLISECONDS)
      .readTimeout(0, TimeUnit.MILLISECONDS)
      .writeTimeout(0, TimeUnit.MILLISECONDS)
      .cookieJar(new ReactCookieJarContainer());

    return enableTls12OnPreLollipop(client).build();
  }
//...

Additional Information

• React Native version: 0.43.4
• Platform: both, but primarily Android
• Development Operating System: Windows 10
• Dev tools: Android Studio

[hey99xx]

Very related https://github.com/facebook/react-native/issues/13487

[hramos]

Hi there! This issue is being closed because it has been inactive for a while. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. Either way, we're automatically closing issues after a period of inactivity. Please do not take it personally!

If you think this issue should definitely remain open, please let us know. The following information is helpful when it comes to determining if the issue should be re-opened:

• Does the issue still reproduce on the latest release candidate? Post a comment with the version you tested.
• If so, is there any information missing from the bug report? Post a comment with all the information required by the issue template.
• Is there a pull request that addresses this issue? Post a comment with the PR number so we can follow up.

If you would like to work on a patch to fix the issue, contributions are very welcome! Read through the contribution guide, and feel free to hop into #react-native if you need help planning your contribution.

[celesteshire]

me too...
react native version : 0.48.3

[337240552]

it's a bug, application level cannot access okhttpclient instance, version 0.51.0

[ozkarram]

OkHttp shared instance is back (RN v 0.54.0).
More info of how to implement it: https://medium.com/@jaedmuva/react-native-ssl-pinning-is-back-e317e6682642