ReactNative自定義NetworkingModule網路模組

1). 思路

I. 在MainApplication中的getPackages方法中，重複新增NetworkingModule模組，後者覆蓋前者。但官方的NetworkingModule中canOverrideExistingModule方法始終返回false， 故無法替換。

@Override
  public boolean canOverrideExistingModule() {
    // TODO(t11394819): Make this final and use annotation
    return false;
  }

II. 替換原有的OkHttpClient，此方法經試驗過後依舊無效。。

OkHttpClient okHttpClient = OkHttpClientProvider.getOkHttpClient().newBuilder().addNetworkInterceptor(getHttpLoggingInterceptor()).build();
                    OkHttpClientProvider.replaceOkHttpClient(okHttpClient);

III. 建立MainReactPackage，並繼承MainReactPackage類，實現getNativeModules方法，在getNativeModules方法中修改列表。

• 修改方法一：遍歷模組列表，並判斷哪一個下標的type(型別)是NetworkingModule.class, 並在重新設定當前下標的數值。出現的問題，使用自增變數遍歷，效率不如迭代。
• 修改方法二：建立一個模組列表，迭代原有的模組列表，並判斷type是否為NetworkingModule.class，如果是則新增自定義的，反之直接新增即可。 出現的問題：每次都有遍歷所有的模組影響效率。
• **修改方法三：****將原有的模組列表拷貝為新的模組列表，迭代原有的模組列表，並判斷type是否為NetworkingModule.class，如果是則先在拷貝的模組列表中移除當前項，再新增自定義的模組，完成後break跳出。

2). 程式碼

/**
 * 自定義的MainReactPackage工具包
 * 1. 移除了官方新增的NetworkingModule模組
 * 2. 新增了帶有攔截器的自定義的NetworkingModule模組
 * 3. 新增`com.squareup.okhttp3:logging-interceptor:3.10.0`
 * 4. 實現了網路訪問時的日誌列印
 * Created by mazaiting on 2018/6/13.
 */

public class CustomMainReactPackage extends MainReactPackage {
  
  /**
   * 獲取日誌攔截器
   *
   * @return Http日誌攔截器
   */
  private static HttpLoggingInterceptor getHttpLoggingInterceptor() {
    // 日誌顯示級別
    HttpLoggingInterceptor.Level level = HttpLoggingInterceptor.Level.BODY;
    // 新建攔截器
    HttpLoggingInterceptor loggingInterceptor = new HttpLoggingInterceptor(new HttpLoggingInterceptor.Logger() {
      @Override
      public void log(@NonNull String message) {
        // 判斷是否有內容
        if (!TextUtils.isEmpty(message)) {
          // 列印日誌
          Log.e("Okhttp3 =====>", message);
        }
      }
    });
    // 設定顯示級別
    loggingInterceptor.setLevel(level);
    return loggingInterceptor;
  }
  
  /**
   * 重寫NativeModules模組
   *
   * @param context 上下文
   */
  @Override
  public List<ModuleSpec> getNativeModules(ReactApplicationContext context) {
    List<ModuleSpec> nativeModules = super.getNativeModules(context);
    // 返回整改後的Modules列表
    return adjustModules(context, nativeModules);
  }

  /**
   * 修改系統的Modules
   *
   * @param context       上下文
   * @param nativeModules 本地模組
   * @return 模組列表
   */
  private List<ModuleSpec> adjustModules(final ReactApplicationContext context, List<ModuleSpec> nativeModules) {
    // 建立攔截器列表，NetworkInterceptorCreator在com.facebook.react.modules.network包下
    final List<NetworkInterceptorCreator> list = new ArrayList<>();
    // 新增攔截器
    list.add(new NetworkInterceptorCreator() {
      @Override
      public Interceptor create() {
        // 返回自定義的攔截器
        return getHttpLoggingInterceptor();
      }
    });
    // 建立模組列表
    List<ModuleSpec> modules = new ArrayList<>(nativeModules);
    // 遍歷模組
    for (ModuleSpec moduleSpec : nativeModules) {
      // 判斷是否為NetworkingModule網路模組
      if (NetworkingModule.class.equals(moduleSpec.getType())) {
        modules.remove(moduleSpec);
        // 新增自定義的網路模組
        modules.add(ModuleSpec.nativeModuleSpec(
                NetworkingModule.class,
                new Provider<NativeModule>() {
                  @Override
                  public NativeModule get() {
                    // 返回帶有攔截器的NetworkingModule網路模組
                    return new NetworkingModule(context, list);
                  }
                }));
        break;
      }
    }
    return modules;
  }
}

3). kotlin版本

/**
 * 自定義的MainReactPackage工具包
 * 1. 移除了官方新增的NetworkingModule模組
 * 2. 新增了帶有攔截器的自定義的NetworkingModule模組
 * 3. 新增`com.squareup.okhttp3:logging-interceptor:3.10.0`
 * 4. 實現了網路訪問時的日誌列印
 * Created by mazaiting on 2018/6/13.
 */
class CustomMainReactPackage : MainReactPackage() {
  
  /**
   * 獲取日誌攔截器
   * @return Http日誌攔截器
   */
  private fun getHttpLoggingInterceptor(): HttpLoggingInterceptor {
    // 新建
    val loggingInterceptor = HttpLoggingInterceptor(
            HttpLoggingInterceptor.Logger { message: String? ->
              if (!TextUtils.isEmpty(message)) {
                Log.d("OkHttp=====>", message)
              }
            }
    )
    loggingInterceptor.level = HttpLoggingInterceptor.Level.BODY;
    return loggingInterceptor
  }
  
  override fun getNativeModules(context: ReactApplicationContext?): MutableList<ModuleSpec> {
    // 獲取父類的模組
    val nativeModules = super.getNativeModules(context)
    return adjustModules(context, nativeModules)
  }
  
  /**
   * 矯正模組列表
   * @param context 上下文
   * @param nativeModules 模組列表
   */
  private fun adjustModules(context: ReactApplicationContext?, nativeModules: List<ModuleSpec>): MutableList<ModuleSpec> {
    // 建立攔截器，並新增Http攔截器
    val list = Arrays.asList(NetworkInterceptorCreator { getHttpLoggingInterceptor() })
    // 拷貝模組
    val modules = ArrayList(nativeModules)
    // 遍歷
    nativeModules.forEach { moduleSpec: ModuleSpec ->
      // 判斷型別
      if (NetworkingModule::class.java == moduleSpec.type) {
        // 移除當前項
        modules.remove(moduleSpec)
        // 新增新項
        modules.add(ModuleSpec.nativeModuleSpec(
                NetworkingModule::class.java,
                { NetworkingModule(context, list) }
        ))
        return@forEach
      }
    }
    return modules
  }
}