In simple terms, HTTP Proxy is an middle man between client and backend server. When a client makes request to backend server, the proxy server intercepts and analyses the requests and then communicates with the backend server.
Tools like Charles, ProxyMan and Fiddler are local proxy servers which allows to view HTTP/S network traffic between the client and the backend server.
Lets understand this with an real life example, Amazon acts as a broker or proxy between the shoppers and the sellers. Amazon allows shoppers to place an order and if the order is confirmed it communicates the same to the seller. Seller then will let amazon know when the order is ready and amazon will ship the order to the customer. So in this case shopper is placing order to seller through amazon.
One might argue that in React Native debugging tools like RNDebugger, Reactotron, Flipper etc offers out of the box network inspect option. But enabling proxy offers just more than just inspecting a API call made from client.
- Black box testing
- Manipulating/Overriding the API calls by modifying the query params, headers etc to mimic API failure or different backend behaviour and also analyse how our mobile app reacts to it.
- Testing all possible network conditions that your app users may face. Throttle the network to mimic mobile network and analyse its impact on app launch time, navigating between the screens etc.
2. DSAT — Dynamic analysis as part of mobile application security testing
DSAT has a broader scope, but for this article we will limit to network monitoring
- DSAT can identify sensitive unencrypted data in transit
- Vulnerabilities introduced by third-party libraries
- Man-in-The-Middle attack [MiTM]: A security analyst can use Burp Suite proxy to eavesdrops and manipulates network calls to the backend servers from the client application. These tests are performed to identify flaws that could lead to sensitive information disclosure or unauthorised access.
Let’s see how to enable HTTP proxy for mobile app
Make sure proxy is not enabled in the release builds
Android app [OS version ≥ N]
To enable proxy for debug variant in android. Modify the AndroidManifest.xml under “debug” variant folder. (Create AndroidManifest.xml with following configuration if it does not exists )
Add below code to AndroidManifest.xml file under “debug” folder
Create “xml” folder under “res” folder and place network_security_config.xml
And you are done!
Follow the instructions to connect to proxy
If you are using Windows system, you can use Charles and follow instructions for it . But rest of the code changes remains the same irrespective of the tool used for network monitoring.
Creating New App Variant
Alternatively, you can create a new android app variant. This works like a charm if we want to create a build without a local metro server that can be shared with QA/Security analysts or across the teams.
Now, Create a new variant folder as shown and add the following AndroidManifest.xml
Add the network security configuration to newly created AndroidManifest.xml or update an existing manifest if you already have one.
Create “xml” folder under “res” and place variant_proxy_security_config.xml file.
Register a new variant in Gradle build file as shown below.
Setting “bundleInProxy: true” makes sure to bundle JS and assets in the new variant that we have added instead of using local metro server.
Android run commands
Update “package.json” by adding a new command to run proxy variant as follows
Or directly run the android variant from terminal
No code changes are required to enable proxy on iphone or ipads.
Please follow the steps for setting up proxy
If you couldn’t access to Charles/Proxyman local server for installing the SSL certificate from mobile
- Make sure device and laptop is on the same network.
- Make sure your laptop’s firewall is configured to allow incoming traffic.
On mac go to
System Preferences → Security & Privacy → Firewall → Advanced
and make sure the follow options are checked
Source code can be found here