hacktricks/src/mobile-pentesting/android-app-pentesting/react-native-application.md

{{#include ../../banners/hacktricks-training.md}}

# React Native Toepassing Analise

Om te bevestig of die toepassing op die React Native raamwerk gebou is, volg hierdie stappe:

1. Hernoem die APK-lêer met 'n zip-uitbreiding en onttrek dit na 'n nuwe gids met die opdrag `cp com.example.apk example-apk.zip` en `unzip -qq example-apk.zip -d ReactNative`.

2. Navigeer na die nuut geskepte ReactNative-gids en vind die assets-gids. Binne hierdie gids behoort jy die lêer `index.android.bundle` te vind, wat die React JavaScript in 'n geminimaliseerde formaat bevat.

3. Gebruik die opdrag `find . -print | grep -i ".bundle$"` om die JavaScript-lêer te soek.

## Javascript Kode

As jy die inhoud van die `index.android.bundle` nagaan en die JavaScript-kode van die toepassing vind (selfs al is dit geminimaliseer), kan jy **dit analiseer om sensitiewe inligting en kwesbaarhede te vind**.

Aangesien die bundel eintlik al die JS-kode van die toepassing bevat, is dit moontlik om **dit in verskillende lêers te verdeel** (wat die omgekeerde ingenieurswese potensieel makliker maak) met behulp van die **tool [react-native-decompiler](https://github.com/numandev1/react-native-decompiler)**.

### Webpack

Om die JavaScript-kode verder te analiseer, kan jy die lêer op [https://spaceraccoon.github.io/webpack-exploder/](https://spaceraccoon.github.io/webpack-exploder/) oplaai of volg hierdie stappe:

1. Skep 'n lêer genaamd `index.html` in dieselfde gids met die volgende kode:
```html
<script src="./index.android.bundle"></script>
```
2. Maak die `index.html` lêer in Google Chrome oop.

3. Maak die Ontwikkelaar Toolbar oop deur **Command+Option+J vir OS X** of **Control+Shift+J vir Windows** te druk.

4. Klik op "Sources" in die Ontwikkelaar Toolbar. Jy behoort 'n JavaScript-lêer te sien wat in vouers en lêers verdeel is, wat die hoofpakket vorm.

As jy 'n lêer genaamd `index.android.bundle.map` vind, sal jy in staat wees om die bronkode in 'n ongeminifiseerde formaat te analiseer. Kaartlêers bevat bronkaarte, wat jou toelaat om geminifiseerde identifiseerders te kaart.

Om sensitiewe akrediteerbare en eindpunte te soek, volg hierdie stappe:

1. Identifiseer sensitiewe sleutelwoorde om die JavaScript-kode te analiseer. React Native-toepassings gebruik dikwels derdeparty-dienste soos Firebase, AWS S3-diens eindpunte, private sleutels, ens.

2. In hierdie spesifieke geval is dit waargeneem dat die toepassing die Dialogflow-diens gebruik. Soek vir 'n patroon wat verband hou met sy konfigurasie.

3. Dit was gelukkig dat sensitiewe hard-gecodeerde akrediteerbare in die JavaScript-kode gevind is tydens die rekonsiliasieproses.

### Verander JS-kode en herbou

In hierdie geval is dit maklik om die kode te verander. Jy moet net die app hernoem om die uitbreiding `.zip` te gebruik en dit uit te pak. Dan kan jy **die JS-kode binne hierdie pakket wysig en die app herbou**. Dit behoort genoeg te wees om jou in staat te stel om **kode in die app in te spuit** vir toetsdoeleindes.

## Hermes bytecode

As die pakket **Hermes bytecode** bevat, sal jy **nie toegang hê tot die Javascript-kode** van die app nie (selfs nie die geminifiseerde weergawe nie).

Jy kan nagaan of die pakket Hermes bytecode bevat deur die volgende opdrag uit te voer:
```bash
file index.android.bundle
index.android.bundle: Hermes JavaScript bytecode, version 96
```
U kan egter die gereedskap **[hbctool](https://github.com/bongtrop/hbctool)**, **[hermes-dec](https://github.com/P1sec/hermes-dec)** of **[hermes_rs](https://github.com/Pilfer/hermes_rs)** gebruik om die **bytecode te ontbind** en ook om dit **na 'n pseudo JS-kode te dekompileer**. Om dit te doen, byvoorbeeld hierdie opdragte:
```bash
hbc-disassembler ./index.android.bundle /tmp/my_output_file.hasm
hbc-decompiler ./index.android.bundle /tmp/my_output_file.js
```
### Verander kode en herbou

Ideaal gesproke behoort jy in staat te wees om die gedissasembelde kode te wysig (om 'n vergelyking, of 'n waarde of wat ook al jy moet verander) en dan **die bytecode te herbou** en dan die app te herbou.

Die hulpmiddel **[hbctool](https://github.com/bongtrop/hbctool)** ondersteun die dissasembler van die bundel en die herbou daarvan nadat die veranderinge aangebring is, maar dit **ondersteun slegs ou weergawes** van Hermes bytecode.

Die hulpmiddel **[hermes-dec](https://github.com/P1sec/hermes-dec)** ondersteun nie die herbou van die bytecode nie.

Die hulpmiddel **[hermes_rs](https://github.com/Pilfer/hermes_rs)** ondersteun die herbou van die bytecode, maar dit is eintlik 'n biblioteek en nie 'n CLI-hulpmiddel nie.

## Dinamiese Analise

Jy kan probeer om die app dinamies te analiseer deur Frida te gebruik om die ontwikkelaarmodus van die React-app in te skakel en **`react-native-debugger`** te gebruik om daaraan te koppel. Maar hiervoor het jy blykbaar die bronkode van die app nodig. Jy kan meer inligting hieroor vind in [https://newsroom.bedefended.com/hooking-react-native-applications-with-frida/](https://newsroom.bedefended.com/hooking-react-native-applications-with-frida/).

## Verwysings

- [https://medium.com/bugbountywriteup/lets-know-how-i-have-explored-the-buried-secrets-in-react-native-application-6236728198f7](https://medium.com/bugbountywriteup/lets-know-how-i-have-explored-the-buried-secrets-in-react-native-application-6236728198f7)
- [https://www.assetnote.io/resources/research/expanding-the-attack-surface-react-native-android-applications](https://www.assetnote.io/resources/research/expanding-the-attack-surface-react-native-android-applications)
- [https://payatu.com/wp-content/uploads/2023/02/Mastering-React-Native-Application-Pentesting-A-Practical-Guide-2.pdf](https://payatu.com/wp-content/uploads/2023/02/Mastering-React-Native-Application-Pentesting-A-Practical-Guide-2.pdf)

{{#include ../../banners/hacktricks-training.md}}