Belajar React Native - Secure Storage & Credentials

#Pendahuluan

Token login dan kredensial adalah kunci rumah aplikasi kalian. Jika token jatuh ke tangan yang salah, semua data user bisa dicuri. Di episode 9 kalian menyimpan data biasa; sekarang waktunya menangani data yang tidak boleh bocor.

Episode 13 membahas secure storage: Keychain di iOS dan Keystore di Android untuk menyimpan token, mengapa AsyncStorage bukan pilihan untuk data sensitif, konfigurasi .env per build, dan kebiasaan agar secret tidak pernah ter-commit ke repository.

#Keychain dan Keystore

#Install react-native-keychain

Keychain (iOS) dan Keystore (Android) adalah tempat penyimpanan kredensial yang dilindungi perangkat keras dan biometrik. Library react-native-keychain menyatukan keduanya:

npm install react-native-keychain

#Menyimpan dan Membaca Token

Simpan token di Keychain

import * as Keychain from "react-native-keychain";
 
async function simpanToken(token) {
  await Keychain.setGenericPassword("auth", token, {
    service: "com.example.myapp",
  });
}
 
async function bacaToken() {
  const kredensial = await Keychain.getGenericPassword();
  return kredensial ? kredensial.password : null;
}

setGenericPassword("auth", token) menyimpan username dan password generik. Dalam praktik, field username bisa berisi identitas user dan field password berisi token. Data tersimpan di secure storage perangkat, bukan di file aplikasi biasa.

#Mengapa Bukan AsyncStorage

AsyncStorage menyimpan data sebagai file teks biasa yang bisa dibaca siapa saja dengan akses ke perangkat atau backup. Token tidak boleh masuk ke sana. Secure storage memanfaatkan enkripsi dan akses terbatas sistem — itulah tempat yang benar untuk kredensial.

#Menghindari Secret di Bundle

#Apa Itu Bundle

Saat release, React Native mengemas JavaScript menjadi satu file bundle yang disertakan di aplikasi. Siapa pun bisa membongkar APK atau IPA dan membaca bundle-nya. Artinya, kunci API dan secret yang ditulis sebagai string di kode otomatis terekspos.

#Berapa Pun Amannya Storage, Bundle Tetap Terbaca

Bahkan nilai di .env yang diinjeksi saat build tetap bisa ditemukan di bundle setelah dibongkar. Pahami level keamanannya: .env dan react-native-config melindungi secret dari repository, bukan dari reverse engineering. Secret yang benar-benar sensitif — kunci server, secret signature — tidak pernah boleh berada di aplikasi klien.

#Env dan Build Config

#.env per Environment

Untuk membedakan konfigurasi staging dan production, buat file .env terpisah per environment:

.env.example
.env.development
.env.staging
.env.production

.env.example berisi placeholder tanpa nilai asli dan menjadi satu-satunya file env yang boleh di-commit.

#Membaca Konfigurasi dengan react-native-config

react-native-config membaca file env saat build dan menyuntikkan nilainya ke aplikasi:

npm install react-native-config

Membaca konfigurasi

import Config from "react-native-config";
 
export const API_URL = Config.API_URL;
export const SENTRY_DSN = Config.SENTRY_DSN;

#Memilih Env Saat Build

Pilih file env lewat variabel ENVFILE saat menjalankan build Android:

cd android
ENVFILE=.env.staging ./gradlew assembleRelease

Perintah di atas membuat APK release yang memakai nilai dari .env.staging. Untuk project Expo, pemilihan env dilakukan lewat profil EAS Build di eas.json.

#Kebiasaan Agar Secret Tidak Bocor

#.gitignore untuk Semua Env

Kecualikan semua file env dari git, kecuali contoh:

.env
.env.*
!.env.example

Baris pertama mengabaikan semua file env, dan baris ketiga mengecualikan .env.example dari pengabaian agar tetap ter-commit sebagai dokumentasi.

#Audit dan Rotasi

Jika secret pernah ter-commit, anggap sudah bocor — rotasi segera. Jadikan pemeriksaan secret sebagai bagian dari code review dan pipeline: skan repository dengan tools deteksi secret sebelum merge. Episode 14 akan membahas mitigasi reverse engineering lebih lanjut.

#Penutup

Episode 13 mengamankan kredensial: token disimpan di Keychain dan Keystore, bukan AsyncStorage, secret dihitung sudah terekspos di bundle, .env per build memisahkan konfigurasi, dan .gitignore mencegah secret masuk repository.

Inti yang harus dibawa pulang:

• Keychain dan Keystore adalah tempat yang benar untuk token.
• AsyncStorage tidak aman untuk data sensitif.
• Bundle aplikasi bisa dibongkar; secret di kode dianggap publik.
• .env per environment memisahkan konfigurasi staging dan production.
• Hanya .env.example yang boleh di-commit.
• Secret yang pernah bocor wajib dirotasi.

Di episode 14 selanjutnya kita akan membahas network security dan TLS: network security config Android, App Transport Security di iOS, certificate pinning, serta mitigasi reverse engineering dan hardening aplikasi.