- Расшифровка HTTPS-запросов на мобильных устройствах iOS/Android: Charles, macOS, немного магии
- Android
- Charles: незаменимый тул в арсенале QA-инженера
- Как это работает?
- Мониторинг трафика
- Подмена данных
- Rewrite settings
- Breakpoints
- Самое главное
- How to set up Charles Proxy for mobile and web apps?
- Basic Configuration
- IOS Simulator
- Android Emulator
- Web Browser (Chrome)
- IOS Devices
- Android Devices
- Debugging using Charles
- Breakpoints Tool
Расшифровка HTTPS-запросов на мобильных устройствах iOS/Android: Charles, macOS, немного магии
Feb 24, 2020 · 3 min read
Замечательная и бесплатная программа Charles перехватывает весь сетевой трафик вашего компьютера, в том числе HTTPS, расшифровывая его при помощи промежуточного сертификата. Но что если мы хотим перехватывать трафик из приложений, установленных на iOS/Android-устройстве?
Следуя простой инструкции, пропишите адрес своего компьютера в каче с тве прокси-сервера на своём устройстве, установите промежуточный сертификат, и в вашем Charles на компьютере начнёт перехватываться весь трафик с устройства, а HTTPS-трафик будет расшифрован. В конце инструкции есть пометка о том, что HTTPS-трафик из приложений будет расшифрован, только если разработчик добавил в plist-файл своего приложения специальный флаг NSAllowsArbitraryLoads. К сожалению, если этого нет, то со своей стороны сделать вы ничего не можете — Apple не позволяет изменять и загружать приложения никак, кроме как из App Store.
Android
Для Android-устройств все шаги по первичной настройке устройства идентичны, смотрите инструкцию. Однако, в отличие от iOS, мы можем сами добавить любому приложению необходимый флаг, чтобы перехватить и расшифровать его HTTPS-трафик, даже если разработчик этого не предусмотрел. Если вы никогда не занимались распаковкой, изменением и обратной запаковкой APK-приложений для Android, вот подробная инструкция:
- Получите APK-файл нужного вам приложения у разработчика или из Google Play при помощи специального сайта.
- Установите на macOS утилиту командной строки apktool .
- Скачайте утилиту zipalign .
Она входит в состав Android Studio — официального инструментария от Google для разработки Android-приложений — но не распространяется отдельно.
Я извлёк утилиту из официального пакета, ничего в ней не изменяя, чтобы вам не пришлось скачивать и устанавливать гигабайтное приложение от Google. Однако, если вы не доверяете файлу, вы можете самостоятельно скачать Android Studio с официального сайта Google, установить его, и найти утилиту в комплекте (для поиска вам пригодится команда find
/Library/Android/sdk/build-tools -name «zipalign» ).
Перенесите бинарный файл zipalign в папку /usr/local/bin , добавив ему права на исполнение. Для этого выполните в терминале следующие команды (предположим, что zipalign лежит в папке
/Desktop ):
4.1 sudo cp
/Desktop/zipalign /usr/local/bin
4.2 sudo chmod +x /usr/local/bin/zipalign
Распакуйте APK-файл при помощи утилиты apktool :
apktool d
/Desktop/YOUR_APPLICATION_NAME.apk . Удалите APK-файл, чтобы впоследствии не возник конфликт.
apktool b
/Desktop/YOUR_APPLICATION_NAME
Собранное APK-приложение будет лежать в папке
/Desktop/YOUR_APPLICATION_NAME/dist . Перенесите его на
/Desktop .
Сгенерируйте ключи и подпишите APK-приложение:
9.1. keytool -genkey -v -keystore
/Desktop/YOUR_APPLICATION_NAME.keystore -alias myApp -keyalg RSA -validity 10000
9.2. jarsigner -verbose -keystore
/Desktop/YOUR_APPLICATION_NAME.apk myApp
9.3. zipalign -f -v 4
/Desktop/YOUR_APPLICATION_NAME_signed.apk
Теперь трафик от приложения будет расшифровываться в Charles на компьютере при помощи того же промежуточного сертификата. Вы можете пользоваться всеми функциями Charles, включая подмену файлов и запросов, и исследовать трафик приложения.
Источник
Charles: незаменимый тул в арсенале QA-инженера
Для тестирования мобильных приложений, работающих с удаленными серверами, QA-инженеру приходится держать под рукой множество разных тестовых аккаунтов, логов, запросов и ответов. Реальность такова, что не всегда удается договориться о предоставлении нужных тестовых данных в срок. Чаще всего серверные разработчики будут незнакомыми вам людьми по ту сторону Скайпа. В таких ситуациях приходится своими руками подменять ответ сервера перед его передачей в приложение.
Чтобы редактировать выдачу сервера и воспроизводить сложные тестовые сценарии в QA Redmadrobot, мы используем Charles.
Как это работает?
Charles — инструмент для мониторинга HTTP/HTTPS трафика. Программа работает как прокси-сервер между мобильным приложением (в нашем случае) и сервером этого приложения. Charles записывает и сохраняет все запросы, которые проходят через подключенный к нему телефон и позволяет их редактировать.
1. Качаем и устанавливаем.
2. При первом запуске Charles заботливо предложит автоматически настроить параметры сети — соглашаемся.
3. Переходим в Proxy > Proxy Settings и выставляем порт 8888, если он уже не прописан.
4. На телефоне заходим в настройки Wi-Fi и прописываем в прокси сервер IP-адрес вашего Mac и порт 8888.
Телефон должен быть подключен к той же Wi-Fi сети, что и ваш Mac.
Готово. При следующем соединении клиент Charles попросить разрешение подключить ваш телефон. После этого в Charles начинают отображаться все HTTP-запросы и ответы, которые проходят через ваш телефон.
Для мониторинга HTTPS-трафика нужно пройти дополнительные шаги:
5. Переходим в браузер телефона и заходим на www.charlesproxy.com/getssl для установки сертификата SSL, который будет использоваться при подключении. Устанавливаем.
6. В списке хостов выбираем желаемый хост с HTTPS и ставим галочку Enable SSL Proxying.
Готово. Теперь в клиенте Charles отображается HTTPS-трафик по выбранному хосту.
Важно
Если ваше приложение использует SSL pinning, то Charles не сможет перехватывать запросы и ответы.
Мониторинг трафика
Для наглядной демонстрации работы с API используем приложение Хабрахабр для Android. На iPhone стоит защита от программ типа Charles, но на Android её нет.
Charles выстраивает все запросы в порядке их отправки на сервер. Запросы и ответы можно просматривать как в отформатированном, так и в «сыром» виде. В QA Redmadrobot во время тестирования телефон всегда подключен к Charles. Таким образом остается возможность посмотреть историю запросов и отследить хитрые баги.
Подмена данных
Как видите, у меня не так много кармы. Charles поможет сделать вид, что её чуть больше, чем есть на самом деле.
Выдача по аккаунту выглядит так (только JSON-строка, без header’ов):
В логе есть поле score:
По всей видимости, как раз то, что мне нужно.
Rewrite settings
Для подмены серверных данных открываем Tools > Rewrite.
В списке слева отображаются сеты из запросов, которые можно составлять на свой вкус. После создания сета идет выставление location. Здесь мы прописываем URL запроса с query параметрами (по желанию).
Следующий шаг — создать правило подмены. К сожалению, Charles не умеет подменять информацию по ключу. Нужно вручную прописывать ключ и значение, а затем писать то, что мы ходим увидеть.
Окно создания правила будет выглядеть следующим образом:
Сам экран подмены будет выглядеть приблизительно так:
Следующий ответ по запросу информации о себе будет иметь отредактированные данные, score = 5000:
При следующем переходе на экран профиля в приложении Хабра мы увидим плод своих трудов.
Хочу еще раз напомнить, что информация на сервере остается прежней. Данные изменяются во время путешествия к МП и эти изменения никак не затрагивают реальные данные профиля.
Таким же образом можно подменять не только ответы, но и запросы. Для этого на экране Rewrite rule нужно поставить галочку в поле Request, а не Response.
Breakpoints
При подмене запросов с помощью Rewrite settings в Charles невозможно редактировать кириллицу. При изменении любой информации на кириллицу ваши логи будут состоять из множества вопросительных знаков.
К счастью, этот недостаток можно обойти с помощью другой функции Charles — breakpoints. Идея похожая, но только ответы останавливаются прямо перед передачей в МП, и их можно редактировать своими руками в реальном времени.
Открываем Breakpoints settings и прописываем URL запроса.
При следующем ответе по этому запросу Charles перехватит всю выдачу и позволит нам с ней работать. Следует держать в голове, что МП может выкинуть ошибку по тайм-ауту, и текущий запрос уйдет в никуда.
Заменим мой логин на что-нибудь, написанное на кириллице.
Вот и все. Приложение отображает нужную нам информацию и проблем с кириллицей не возникает.
Самое главное
Лицензионная версия Charles обойдется в $50 на человека. Charles разрешает пользоваться собой бесплатно, но с ограничениями. Функционал инструмента не блокируется, но во время использования триальной версии иногда будут появляться окна с просьбой подождать 5-10 секунд перед возобновлением работы и еще раз подумать о том, как клево было бы купить лицензию. Также каждые 30 минут программа будет автоматически завершаться и вся история запросов будет утрачена.
Источник
How to set up Charles Proxy for mobile and web apps?
Ever wondered how to maintain quality of software even in worst-case scenarios be it network failures or server breakdown?
One of the solutions to the above scenario is replicating the possible failure environment by configuring Charles proxy.
Let’s understand how this tool helps in providing the solution to the mentioned cause in the various software apps.
Charles proxy is an interactive web debugging tool which acts as a middleware between the client (mobile or web app) and the internet. Using this tool we can configure client environment to pass all networking requests and responses through Charles proxy so that we can inspect and even change the data midstream to test how the app responds.
In Web and Internet development we are unable to see what is being sent and received between the web browser/client and the server. Without this visibility, it is difficult and time-consuming to determine exactly where the fault is. Charles makes it easy to see what is happening, so we can quickly diagnose and fix problems.
Basic Configuration
This is common for any type of app; mobile or web.
- Download Charles from the below link:https://www.charlesproxy.com/ make sure that this tool is a paid one, however, we can make use of its trial version.
2. Install the app and have a note of your machine IP address for further configuration
3. Download and install Charles root certificate on the desired remote device where the tests need to be performed i.e, android, iOS device or web browser.
4. Remote device configuration based on the Charles root certificate to be installed on various devices as follows:
IOS Simulator
Open Charles and select the option to install a root certificate on iOS simulator from :
Help>SSL Proxying>Install Charles Root Certificate in iOS Simulator
Open iOS simulator and enable Charles proxy certificate from settings as:
Settings>General>About>Certificate Trust Settings
Open the app under test and validate the requests and response based on the action performed on the app. Experiment adding the breakpoints to API requests and responses.
Android Emulator
Open Emulator settings and configure the Charles proxy for a device with android version N, using either command line or from emulator settings as below:
The command for setting up manual IP on an emulator:
Configuring IP from emulator settings:
Open Charles and select the option to download the Root certificate either from mobile browser hitting chls.pro/ssl or via downloading the file on the system itself post which we can install the same to android device or emulator from:
Help>SSL Proxying>Save Charles Root Certificate…
Save the Charles root certificate to the system, copy to Emulator storage and install it as:
Emulator>Settings>Security>Trusted Credentials>Install from storage>open saved Charles Root certificate
Open the app now and validate the request and response on the Charles, Experiment adding the breakpoints to API requests and responses.
Web Browser (Chrome)
Charles proxy basic configuration remains same for web browsers as well where we install the Charles root certificate on the system and configure it for the browser on the Chrome settings as:
On macOS, please follow the instructions for the macOS above. These instructions only apply to Windows.
- In Charles go to the Help menu and choose “SSL Proxying > Save Charles Root Certificate”. Save the root certificate as a Binary Certificate (.cer) to the desktop, or somewhere where we can easily access it in the next step.
- In Chrome, open the Settings. At the bottom of the settings page, click “Advanced” to open the advanced section, then click the “Manage certificates…” button.
- Go to the “Trusted Root Certification Authorities” tab and click “Import…”.
- Find the certificate file saved from Charles in the previous step, then click Next and Finish, leaving the default options, until you complete the import. Chrome will now always trust certificates signed by Charles.
- After importing we can delete the certificate file that has been saved.
IOS Devices
Even for the devices, the concept of configuring Charles remains same as simulators just have to configure the mobile network proxy with the system and open chls.pro/ssl to get the root certificate download and enable it from settings from below steps:
Settings>General>About>Certificate Trust Settings
Android Devices
For connecting android devices configure the network proxy for the device as mentioned below.
Settings>Wifi>Connected network>Advanced>Proxy>Manual>Set host & port
After configuring it download the root certificate by either downloading to the device and installing it or via navigating to chls.pro/ssl from local device browser to download Charles root certificate.
Installation of root certificate may ask to add further security measures to devices for protecting the credentials before root certificate installation, once done the device is ready to be under Charles proxy influence to debug the network traffic.
Let’s assume we have Charles proxy setup ready on our chosen device.
Now let’s discuss how does the debugging work.
Debugging using Charles
This section focus on actual debugging of the requests and responses inspected via Charles and intercepted according to our need to replicate any particular realtime scenario. For interception there are various of its tools performing their respective functionalities, I want to discuss below few which I found very useful in debugging and ensuring the quality of app under test behaving in various network circumstance.
Breakpoints Tool
The Breakpoints tool lets us intercept requests and responses before they are passed through Charles. We can examine and edit the request or response and then decide whether to allow it to proceed or to block it.
When a request or response trips a breakpoint the Breakpoints window automatically opens in Charles and comes to the front. The Breakpoints window contains a list of the requests and responses currently intercepted and waiting for our action. Select the request or response to view and edit the contents. Then decide to Execute, Abort or Cancel the breakpoint.
Источник