RN https 双向认证

一概述

Rreact Native https双向认证 Android端修改，有两种方案：

一是修改 facebook桥接Android的网络请求

二是自己新建桥接 android和rn，修改android的https请求。

这里用到了第一种方法。第二种方法，有空的话可以试一下，也是可以的。

要想做RN的桥接，首先要先把android原生的 https双向认证搞明白，请看我上篇文章：

https://blog.csdn.net/BingHongChaZuoAn/article/details/93591447

二、实战操作

服务器端和Android端配置就不讲了，上篇文章已经讲过。

1.首先是新建 HttpsReactPackage，修改网络为自己的NetworkingModule

public class HttpsReactPackage extends MainReactPackage {    private String TAG ="HttpsReactPackage";    @Override    public List getNativeModules(final ReactApplicationContext context) {        List retList = new ArrayList<>();        List superList = super.getNativeModules(context);        for (ModuleSpec moduleSpec:superList){            if (moduleSpec.getProvider().get() instanceof NetworkingModule){                continue;            }            retList.add(moduleSpec);        }        retList.add(new ModuleSpec(NetworkingModule.class,                new Provider() {                    @Override                    public NativeModule get() {                        return getTestNetWorkingMoudle(context);                    }                }));        return retList;    }    private NativeModule getTestNetWorkingMoudle(ReactApplicationContext context) {        NetworkingModule networkingModule = new NetworkingModule(context);        try {            Field field = networkingModule.getClass().getDeclaredField("mClient");            field.setAccessible(true);            OkHttpClient okHttpClient2 = OKHttpClientUtils.getOkHttpClient(context);            field.set(networkingModule,okHttpClient2);        } catch (NoSuchFieldException e) {            e.printStackTrace();        } catch (IllegalAccessException e) {            e.printStackTrace();        }         return networkingModule;    }}

2.然后新建 OKHttpClientUtils，做okhttps证书的双向认证，并提供单例 okhttpClient

public class OKHttpClientUtils {    private static @Nullable    OkHttpClient sClient;    public static OkHttpClient getOkHttpClient(Context context) {        if (sClient == null) {            sClient = createClient(context);        }        return sClient;    }    // okhttp3 OkHttpClient is immutable    // This allows app to init an OkHttpClient with custom settings.    public static void replaceOkHttpClient(OkHttpClient client) {        sClient = client;    }    public static OkHttpClient createClient(Context context) {        // No timeouts by default        HttpsUtils.SSLParams sslParams =                null;        try {            sslParams = HttpsUtils.getSslSocketFactory(new InputStream[]{context.getAssets().open("server.crt")},                    context.getAssets().open("test_client.keystore"), "123456");        } catch (IOException e) {            e.printStackTrace();        }        OkHttpClient.Builder client = new OkHttpClient.Builder()                .connectTimeout(0, TimeUnit.MILLISECONDS)                .readTimeout(0, TimeUnit.MILLISECONDS)                .writeTimeout(0, TimeUnit.MILLISECONDS)                .cookieJar(new ReactCookieJarContainer())                .sslSocketFactory(sslParams.sSLSocketFactory, sslParams.trustManager)                .hostnameVerifier(new HostnameVerifier() {                        @Override                        public boolean verify(String hostname, SSLSession session) {                            return true;                        }                    });        return enableTls12OnPreLollipop(client).build();    }    /*      On Android 4.1-4.4 (API level 16 to 19) TLS 1.1 and 1.2 are      available but not enabled by default. The following method      enables it.     */    public static OkHttpClient.Builder enableTls12OnPreLollipop(OkHttpClient.Builder client) {        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN && Build.VERSION.SDK_INT <= Build.VERSION_CODES.KITKAT) {            try {                client.sslSocketFactory(new TLSSocketFactory());                ConnectionSpec cs = new ConnectionSpec.Builder(ConnectionSpec.MODERN_TLS)                        .tlsVersions(TlsVersion.TLS_1_2)                        .build();                List specs = new ArrayList<>();                specs.add(cs);                specs.add(ConnectionSpec.COMPATIBLE_TLS);                specs.add(ConnectionSpec.CLEARTEXT);                client.connectionSpecs(specs);            } catch (Exception exc) {                FLog.e("OkHttpClientProvider", "Error while enabling TLS 1.2", exc);            }        }        return client;    }}

3.修改 application MainReactPackage 改为自己新建的package的加载

private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {    @Override    public boolean getUseDeveloperSupport() {      return BuildConfig.DEBUG;    }    @Override    protected List getPackages() {      return Arrays.asList(          new HttpsReactPackage()      );    }  };

4. 到此fetch https双向认证封装已经完成，调用服务器代码如下：

 fetch('https://192.168.43.238:8443/getUser')    .then((response) => response.json())    .then((responseJson) => {      var jsonStr=JSON.stringify(responseJson);       console.warn(jsonStr);    })    .catch((error) => {      console.error(error);    });

更多相关文章

随机推荐