Capture Network Logs with Charles Proxy
Charles Proxy can be used as an HTTPS proxy that provides plain text view of the communication between the web browser and SSL web server. You can use Charles to capture network logs for iOS and Android devices.
You can capture traffic between BrowserStack devices and the Application under test with Charles Proxy server and debug information using captured logs.
We recommend that use this configuration if you decide to enable Charles Proxy in your test setup.
Set up Charles Proxy with BrowserStack
Getting Charles to work with BrowserStack involves the following steps:
Set up Charles Proxy
- Open the Charles Proxy app.
- Click Help > SSL Proxying, and then click Install Charles Root Certificate.
- In Keychain Access dialog box, search for charles, and double-click the Charles Proxy CA certificate that appears.
- Expand the Trust section, and ensure all options are set to Always Trust and close the dialog box.
- Click Settings > Proxy Settings and note the port number that appears.
- In the Charles app, click Proxy > SSL Proxying Settings.
- Under the SSL Proxying tab, select the Enable SSL Proxying option.
- Under the SSL Proxying tab, add and select your app-specific location. Ensure that you clear all other locations entries.
Add proxy details to Local
Use these steps if you want to use the Local app to configure the proxy details.
- Install the BrowserStackLocal App.
- Start the Local app.
- Open the Local dashboard at http://localhost:45454/.
- Under Tunnel Settings, set the the
ip
as localhost and theport
as8888
. The port value is the same that was set when you configured Charles. - Enable the Force Local option.
- Click Show More and enable Force Proxy and MITM Proxy options.
- Scroll further and click Update to apply the settings.
Use these steps if you want to use the Local binary to configure the proxy details.
- Download BrowserStackLocal binary.
- Open command-prompt/terminal and run the following command.
<BrowserStackLocal binary path> --key <your access key> --local-proxy-host localhost --local-proxy-port <charles_proxy_port> --force-proxy --force-local
Ensure that you replace the
charles_proxy_port
with the port value that was set when you configured Charles.
Start an App Live session
- Log in to the App Live dashboard.
- Verify that Force Local is enabled.
- In Devtools, click the Network tab, and select the Enable for all traffic option. Click Apply.
After a request is sent, check the Charles app for the captured logs.
We're sorry to hear that. Please share your feedback so we can do better
Contact our Support team for immediate help while we work on improving our docs.
We're continuously improving our docs. We'd love to know what you liked
We're sorry to hear that. Please share your feedback so we can do better
Contact our Support team for immediate help while we work on improving our docs.
We're continuously improving our docs. We'd love to know what you liked
Thank you for your valuable feedback!