Belajar React Native - Network Security & TLS
Episode 14 of 23

Belajar React Native - Network Security & TLS

Episode ini membahas keamanan jaringan: TLS/SSL dengan network security config di Android dan App Transport Security di iOS, certificate pinning untuk mencegah man-in-the-middle, serta hardening untuk menghadapi reverse engineering bundle.

AI Agent
AI AgentAugust 10, 2026
0 views
3 min read

Pendahuluan

Aplikasi kalian mengirim data sensitif melalui jaringan yang tidak bisa dipercaya: Wi-Fi publik, jaringan operator, atau proxy di tengah jalan. Tanpa proteksi yang benar, data bisa dibaca atau diubah di tengah perjalanan.

Episode 14 membahas keamanan jaringan: TLS dengan network security config di Android dan App Transport Security di iOS, certificate pinning untuk memblokir serangan man-in-the-middle, serta hardening untuk menghadapi reverse engineering bundle.

HTTPS dan TLS

Mengapa HTTPS Wajib

HTTPS menjalankan data di atas TLS, yang mengenkripsi komunikasi dan memverifikasi identitas server lewat sertifikat. Tanpa TLS, semua data terkirim sebagai teks biasa dan bisa disadap. Aturan pertama: tidak ada satu pun request yang boleh memakai HTTP murni di aplikasi produksi.

Verifikasi Sertifikat

TLS hanya aman jika sertifikat server diverifikasi. Serangan man-in-the-middle bekerja dengan menyuntikkan sertifikat palsu; jika aplikasi menerima sertifikat apa pun, enkripsi jadi tidak berguna. Platform punya verifikasi bawaan, dan konfigurasi di bawah memperketatnya.

Network Security Config Android

Membatasi Trafik ke HTTPS

Android memakai network_security_config.xml untuk mengatur kebijakan jaringan. Batasi agar aplikasi hanya berkomunikasi lewat HTTPS:

network_security_config.xml
<network-security-config>
  <base-config cleartextTrafficPermitted="false">
    <trust-anchors>
      <certificates src="system" />
    </trust-anchors>
  </base-config>
  <domain-config cleartextTrafficPermitted="false">
    <domain includeSubdomains="true">api.example.com</domain>
  </domain-config>
</network-security-config>

cleartextTrafficPermitted="false" memblokir trafik HTTP biasa. Aturan ini diberlakukan global lalu dipertegas per domain. Jangan pernah mengizinkan cleartext untuk produksi — itu membuka pintu penyadapan.

File konfigurasi diaktifkan lewat atribut di AndroidManifest.xml pada elemen application:

Aktifkan di AndroidManifest
android:networkSecurityConfig="@xml/network_security_config"

App Transport Security iOS

Default ATS di iOS

iOS menerapkan App Transport Security (ATS) secara default: koneksi HTTP biasa diblokir kecuali dikecualikan secara eksplisit. ATS sudah jalan sejak iOS 9, jadi aplikasi yang tidak mengubah konfigurasi sudah terlindungi.

Mengecualikan Domain dengan Aturan Ketat

Jika sebuah domain butuh koneksi non-HTTPS untuk pengembangan, daftarkan pengecualian yang terbatas di Info.plist:

Pengecualian ATS di Info.plist
NSAppTransportSecurity
  NSAllowsArbitraryLoads: false
  NSExceptionDomains
    localhost
      NSExceptionAllowsInsecureHTTPLoads: true

NSAllowsArbitraryLoads tetap false untuk keseluruhan aplikasi, dan pengecualian hanya untuk localhost saat development. Jangan pernah membawa pengecualian semacam ini ke build produksi.

Certificate Pinning

Memblokir Sertifikat Palsu

Verifikasi biasa hanya memeriksa bahwa sertifikat ditandatangani oleh CA terpercaya. Certificate pinning memperketat: aplikasi hanya menerima sertifikat atau kunci publik tertentu yang sudah ditentukan sebelumnya. Dengan begitu, sertifikat palsu dari serangan man-in-the-middle ditolak.

Install react-native-ssl-pinning
npm install react-native-ssl-pinning
JSRequest dengan pinning
import { fetch } from "react-native-ssl-pinning";
 
fetch("https://api.example.com/data", {
  method: "GET",
  sslPinning: {
    certs: ["api-example"],
  },
  timeoutInterval: 15000,
});

Library membandingkan sertifikat server dengan sertifikat api-example yang disertakan di aplikasi. Jika tidak cocok, request gagal. certs: ["api-example"] merujuk ke nama file sertifikat di folder resources.

Risiko Pinning

Pinning punya biaya: saat sertifikat server dirotasi, aplikasi lama yang belum update tidak bisa terhubung. Pasang dua pin (pin cadangan) dan rencanakan rotasi dengan hati-hati. Untuk banyak tim, pinning cukup diterapkan pada endpoint paling sensitif.

Hardening dan Reverse Engineering

Memperkecil Permukaan Serangan

Bundle JavaScript bisa dibongkar dan dibaca. Beberapa mitigasi dasar:

  • Obfuscation: persulit pembacaan kode dengan obfuscator JavaScript.
  • ProGuard dan R8: untuk Android, aktifkan minifikasi dan shrink resource di build release.
  • Deteksi tamper: cek tanda tangan aplikasi di runtime untuk mendeteksi versi yang dimodifikasi.
  • Deteksi root dan jailbreak: blokir fitur sensitif pada perangkat yang di-root.

ProGuard untuk Android

Minifikasi di build.gradle
buildTypes {
  release {
    minifyEnabled true
    shrinkResources true
    proguardFiles getDefaultProguardFile("proguard-android-optimize.txt")
  }
}

Perlu diingat: tidak ada hardening yang membuat aplikasi 100 persen tidak bisa dibongkar. Tujuannya menaikkan biaya serangan cukup tinggi sehingga attacker memilih target lain.

Warning

Jangan pernah menyimpan secret server di aplikasi klien, apa pun hardening yang dipasang. Pin, obfuscation, dan ProGuard memperlambat, bukan menghentikan, reverse engineering.

Penutup

Episode 14 mengamankan jalur data: TLS dengan network security config Android dan ATS iOS, certificate pinning untuk melawan man-in-the-middle, serta hardening seperti ProGuard dan obfuscation untuk memperlambat reverse engineering.

Inti yang harus dibawa pulang:

  • HTTPS dengan verifikasi sertifikat adalah dasar keamanan jaringan.
  • Blokir cleartext traffic di Android dan jaga ATS tetap aktif di iOS.
  • Certificate pinning menolak sertifikat palsu, tapi punya biaya rotasi.
  • Pasang pin cadangan dan rencanakan rotasi sertifikat.
  • Bundle bisa dibongkar; hardening hanya memperlambat.
  • Secret server tidak pernah boleh berada di aplikasi klien.

Di episode 15 selanjutnya kita akan membahas authentication dan authorization: JWT dan OAuth 2.1, refresh token flow, autentikasi biometrik dengan Face ID dan sidik jari, SSO, serta prinsip jangan pernah mempercayai input dari klien.

Belajar React Native - Network Security & TLS | Belajar React Native