Charles – Инструкция для чайников
Гайд о том, как с помощью Charles отслеживать пакеты и эмулировать медленную скорость Интернет-соединения на реальном Android -устройстве.
Скачать Charles можно на официальном сайте: www.charlesproxy.com
Продукт условно бесплатный (trial на 30 дней), но нам этого будет вполне достаточно.
Для проведения тестов Вам понадобится:
1) LAN-кабель с вселенным в него интернетом.
2) Ноутбук с возможностью подключения в него того самого LAN-кабеля и wi-fi передатчиком.
3) Реальное Android-устройство с установленным на него мобильным приложением, которое нужно тестировать.
Итак, отключаем ноутбук от всех возможных Wi-fi сетей и подсоединяем к нему LAN-кабель со священным Интернетом. Далее нам необходимо раздать wi-fi с помощью самого ноутбука.
Для этого нужно вызвать командную строку (обязательно — запуск от имени Администратора) и ввести следующие две команды:
(или просто скопировать данный текст в Блокнот, сохранить как *.bat-файл и каждый раз запускать его от имени Администратора).
Wi-fi точка доступа создана. подключаемся к ней своим Android-устройством, имя сети (как Вы догадались, наверное) «WIFI», а пароль – 12345678.
Возможен вариант, что у вас не будет доступа к Интернету на самом устройстве. В таком случае необходимо открыть общий доступ к сети. Как это сделать можно без проблем найти и самому, но раз уж я пишу эту статью, то оставлю полезную ссылку прямо здесь с инструкцией по устранению данной проблемы:
После этого, как показала практика, Интернет на устройстве все-таки появился.
Далее необходимо узнать 2 волшебных цифры:
1) Ваш IP-адрес
2) Номер порта, который использует Charles для прокси.
Первую узнаем здесь же, в командной строке, набрав команду ipconfig.
Из всей чепухи которую Вам выдаст cmd.exe нас интересует только cвойства «Ethernet adapter Подключение по локальной сети», а именно IPv4-адрес.
Запоминаем (записываем) его и идем далее.
Номер порта, который использует Charles можно узнать внутри самой программы. Для этого в главном окне программы выберите пункт меню Proxy, в выпадающем списке – Proxy settings. Перед Вами откроется нечто подобное:
Как вы поняли эти заветные 8888 и есть наше второе число. Теперь необходимо задать ограничение скорости соединения. Для этого пройдем в пункт меню Proxy → Throttle Settings.
Ставим галочку Enable Throttling. Only for selected hosts – можно убрать (если не тестируете зависимость работы приложения от какого-либо конкретного домена).
Самый главный параметр – Bandwidth – пропускная способность нашего соединения – устанавливаем на необходимый Вам уровень (я тестировал очень медленное соединение, поэтому поставил 3kb/s ). Также, включите запись (Start/Stop Recording) нажав на панели главного окна на соответвующую кнопку для начала записи.
Осталось только настроить наше устройство. Для этого зайдите в настройки, раздел Wi-fi. Заходим в свойства сети, которую раздаем с ноутбука (и к которой уже подключено устройство) выбираем «Настройка прокси» и вводим два волшебных числа в соответствующие поля.
Все готово! Возвращаемся обратно в Charles и во вкладке Sequence видим дивную картину:
Это и есть все запросы, которое делает наше приложение (для образца взял мобильную версию ВК), с подробной информацией по каждому запросу.
P.S: На написание данной статьи меня подтолкнуло несколько вещей:
— отсутствие полного и доступного описания в русскоязычной части интернета.
— англоязычное население YouTube во всех роликах предлагало тестировать 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 минут программа будет автоматически завершаться и вся история запросов будет утрачена.
Источник
Android 11 devices and Charles
This tutorial will show you how to configure Charles and your Android 11 device so you can view your app’s network traffic in plain text. FYI, the root certificate installation steps are slightly different to older Android versions
NOTE: Since Android Nougat (7.1), Google have blocked tools like Charles from intercepting/decrypting network traffic from Play Store apps
NOTE: To proceed with this tutorial, you will need to be able to build your own Android app. Make sure the “Network Security Config File” has been added to your app’s repo (see more details here and here).
Be able to build your own Android app
Make sure you have setup the Charles Root certificate on your Mac
Check Wi-fi networks
Make sure your Mac and Android device are on the same Wi-Fi network
Find your Mac’s local IP address
Open Charles -> Help -> Local IP address.
Make note of the IP address as you will need to enter it into your device later
Navigate to device’s Wi-Fi proxy screen
Settings -> Wi-fi -> long press the connected Wi-Fi network to bring up the menu -> Modify -> Advanced options -> select “Manual” from the proxy drop down
NOTE: there are slight navigation differences between OS versions in how to get to your Wifi proxy settings but they should be fairly similar to these screenshots
Configure device’s proxy settings
This step will proxy all your device’s internet traffic through your laptop
- Proxy hostname: this is your Mac’s local IP address
- Proxy Port: 8888
Accept incoming network traffic from your device
On your device, open Chrome and go to a website
Return to your Mac. You should now see this prompt from Charles. Click “Allow”
Encrypted traffic from the device should now appear in Charles
Download Root certificate for device
Return to the device, open Chrome and go to chls.pro/ssl.
Install root certificate
O pen the “Setting” app -> Security -> Encryption & Credentials -> Install a Certificat e -> CA certificate -> Install anyways -> tap on the certificate
Android may prompt you to enter pin, password or fingerprint before installing the root certificate
Verify root certificate has been “trusted”
Return to Encryption & Credentials. Tap Trusted credentials -> USER
You should now see a certificate from “XK72 Ltd” appear
Enable SSL proxying to view traffic in plain text
Return to Charles, right click the network request you are interested in and click the “Enable SSL Proxying” option
FYI, I am using an Android app a friend created to demonstrate decrypting Android app traffic
NOTE: As mentioned at the start of the article, you need the ability to build your own Android app to view decrypted traffic. This step will not work with an app downloaded from the Play Store
Kill and Reopen app
Kill and reopen the app. You should now see the network request details in plain text
Источник
