SSL Pinning in React-Native using trust-kit for android

Hakim KatendeHakim Katende
3 min read

Are you looking to boost the security of your React Native app? Look no further! In this tutorial, I'll show you how to easily implement SSL pinning using Trust Kit for Android. Get ready to take your app's security to the next level. Trust Kit is a powerful tool that makes it easy to add SSL pinning to your app, and I'll provide all the resources you need to get started. Don't miss out on this opportunity to secure your app and keep your users safe. Let's get started now!

**Step 1: **

The trustkit dependency should be added to our android project. You can replace the + with a specific version number implementation ‘com.datatheorem.android.trustkit:trustkit:+’

Step 2:

Add the Network-Security-Config to your project inside the res/xml directory, change the example.com to your domain name, and change AAAAAAAAAAAAAAAAAAAAAAAAAA= to the public key hash. get public keys for domain here .

How to get keys.

Typed in the hostname for which the public key hashes are needed, click submit. Wait until the website is done processing. Click on any of the presented IP addresses, and a page with the details of the certificate will appear. Copy these public keys under the subject ** pin SHA256** to use in your network security configuration.

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config>
        <domain includeSubdomains="true">example.com</domain>
        <pin-set>
            <pin digest="SHA-256">AAAAAAAAAAAAAAAAAAAAAAAAAA=</pin>
        <trustkit-config enforcePinning="true">
            <report-uri>http://example.com/log_report</report-uri>
        </trustkit-config>
    </domain-config>
</network-security-config>

Step 3

Initialize TrustKit in the onCreate method of your main activity, or your main application.

@Override
protected void onCreate(Bundle savedInstanceState) {    
// start ----
    try {
        TrustKit.initializeWithNetworkSecurityConfiguration(this);
    } catch (Exception e) {
        e.printStackTrace();
    }
    OkHttpClientProvider.setOkHttpClientFactory(new CustomClientFactory());
// end ----
    super.onCreate(savedInstanceState);
}

Step 4

In the application tag, set the appropriate configuration in AndroidManifest.xml. The configuration file should be placed in the res/xml directory

<application
    android:name="your-app"
    android:networkSecurityConfig="@xml/network_security_config"
...

**Step 5 **

Create a new class called CustomClientFactory inside the project

package com.package;

import com.datatheorem.android.trustkit.TrustKit;
import com.facebook.react.modules.network.OkHttpClientFactory;
import com.facebook.react.modules.network.OkHttpClientProvider;
import com.facebook.react.modules.network.ReactCookieJarContainer;

import java.net.MalformedURLException;
import java.net.URL;
import java.util.concurrent.TimeUnit;

import okhttp3.OkHttpClient;
public class CustomClientFactory implements OkHttpClientFactory {
@Override
public OkHttpClient createNewNetworkModuleClient() {
        String hostname = null;
        try {
            URL url = new URL("your domain name");
            hostname = url.getHost();
        } catch (MalformedURLException 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(TrustKit.getInstance().getSSLSocketFactory(hostname),TrustKit.getInstance().getTrustManager(hostname));
        return OkHttpClientProvider.enableTls12OnPreLollipop(client).build();
    }
}

Step 6

Try running the application again after syncing the gradle dependencies in Android Studio.

Thanks for taking the time for reading this. If you have any suggestion please leave a comment bellow. Greetings and keep coding…

0
Subscribe to my newsletter

Read articles from Hakim Katende directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

Hakim Katende
Hakim Katende

I'm a mobile and web developer based in Uganda, with experience and passion in the sector. As a result of my education and experience, I have gained the knowledge and skills necessary to build scalable software products. I enjoy every step of the software development life cycle.