- Коротко
- Настройка на десктопе
- Настройка на смартфоне
- Если что-то пошло не так
- UPD: Как раздать VPN
- Видео для утомленных чтением
Что такое Charles
Логотип Charles радикально не похож на общепринятые минималистичные иконки:
«Чарли» — инструмент контроля/мониторинга трафика, который позволяет тестировать веб-приложения. Он нужен QA для анализа запросов, отправляемых приложением к серверу, и ответов. Он умеет читать трафик компьютеров под Windows, и мобильных девайсов, как Android, так и iOS. Наверное, входит в «базовый набор» тестировщика.
Настройка на десктопе
Итак, Charles «вставляется» между тестируемой программой и ее сервером и «читает» коммуникацию между ними. К примеру, когда вводите слово в Google, то ваш ПК (или смартфон) передает в Google поисковый запрос. Charles, если установлен в системе, выступает в роли посредника (или скорее «перехватчика») между приложением и сервером и отслеживает логи запросов, что полезно при разработке и тестировании приложений, которым требуется сервер (то есть практически всех современных приложений).
Установка Charles
В браузере заходим на URL-адрес загрузки пробной версии на официальном сайте (пробника для ознакомления достаточно; для любителей экспериментов, уже немного знакомых с «Чарли», есть бета 5-й версии; но там, судя по их блогу, мало что improved, кроме каких-то сугубо визуальных improvements и iOS-дебагов). На сайте три ссылки на загрузку для различных версий ОС, т.е. для Windows, Mac и Linux. Качаем нужное:
Щелкаем на соответствующей ссылке и ждем конца загрузки.
У нас например Windows. Идем в папку Загрузки, где уже скачан установочный файл Charles-proxy-4.5.4-win64.msi (номер версии в вашем случае будет чуть больше, разница между версиями не принципиальна). Запускаем, после чего появится стандартный для Windows мастер инсталляции:
Соглашаемся с лицензионным соглашением и нажимаем Next:
Жмем Finish. Открываем свежепоставленное приложение Charles. Стартовое окно приведено ниже. Опция Windows proxy должна быть активирована по дефолту. Проверяем в меню Proxy:
При входе отображается структура проекта. Также можно сразу посмотреть как выглядит автоматическая запись логов.
Устанавливаем рут-сертификат
#1) Входим в меню Помощь, и в выпадающем списке находим пункт “Install Charles Root Certificate”.
#2) Указываем, где установить сертификат.
#3) Если выбран локальный компьютер, то задаем расположение папки, нажав на кнопку Browse и выбрав «Trusted Root Certification Authorities«.
#4) Жмем OK и продолжаем.
#5) Появится уведомление об успешно установленном сертификате.
Активация SSL-проксирования
Теперь можно приступать к изучению возможностей Charles что касается SSL, т.е. читать запросы от локальной машины на сервер.
- Откриваем Google, набираем wikipedia и жмем Искать.
- Открываем Charles и переключаем на отображение Структуры — в левом верхнем углу окна находим опцию отображения (Sequence/Structure) и выбираем режим Structure.
- В появившихся фильтрах вводим “wiki” для вывода запросов, содержащих этот текст.
- Нажимаем правой кнопкой в правой части нашего запроса и выбираем пункт Enable SSL proxying.
Так включается SSL-прокси для одного адреса. Если нужно контролировать все подключения, то необходимо настроить еще некоторые параметры в SSL proxying.
Для этого:
#1) Щелкните в строке меню пункт Proxy и выберите пункт SSL Proxy Settings.
Там можно увидеть, что Google уже есть в списке (ведь мы его добавляли раньше).
#2) Щелкните кнопку Add и в Edit location добавляем звездочку (*) в поле Host и 443 в поле Port. Звездочка значит, что все «подобные» URL будут включены в фильтр по локации.
Теперь ОК.
Идем далее — прочие функции и настройки.
Нажимаем контекстное меню любого URL-адреса, чтобы посмотреть список доступных опций. У большинства опций название ясно отражает предназначение.
Функциональность Charles (кнопки)
Сверху в ленту вынесены самые используемые функции.
Пройдемся по ним.
#1) Clear (Удалить сессию): Нажатие удаляет сессию, после чего можно начать новую сессию.
#2) Stop/Start: По дефолту функция включена. Если нужно приостановить запись в лог, нажимаем Stop.
#3) SSL Proxying: Если вы ранее активировали эту функцию в настройках, то данная кнопка будет активна.
#4) Network Throttling (Троттлинг или дросселирование сети): Функция искусственного ограничения скорости (т.н. дросселирования) сети служит для имитации сложных условий или устаревших технологий в сети, таких как 2G, или плохого покрытия 3G/4G/WiFi, или может подключения через модем.
Это полезно, когда тестируем приложение, сильно зависящее от скорости подключения — как оно поведет себя в различных условиях. Точнее указать скорость и параметры сети — клавиши Ctrl+Shift+T или меню Proxy => Throttle settings.
#5) Breakpoints: Эта функция видимо не понадобится, если вы не разработчик. Если поставить точку останова на какой-либо запрос, то когда Charles получит такой запрос, он будет ждать дополнительных действий.
#6) Compose: Функция позволяет редактировать запросы и отправлять их в уточненном виде. Можно изменить/добавить нужные параметры и отправить с ними.
#7) Repeat: Запрос в редакторе будет отправлен повторно. Функция нужна, когда понадобилось повторить запрос, не выполняя действие заново.
#8) Validate: функция предназначена для проверки (валидации) запросов или ответов. Открывается новая вкладка с результатами валидации.
#9) License Purchase: Придется нажать через месяц.
#10) Tools: Здесь вспомогательные инструменты контроля трафика.
#11) Settings: Настройки управления доступом, прокси, протоколирования, кастомные настройки под проект и т.д.
Сохранение и шеринг сессии
Часто нужно передать логи другому тестировщику или разработчику. Для этого сохраняем или экспортируем текущую сессию.
Нажимаем Control+S или переходим в меню File и жмем Save. Далее вводим удобочитаемое имя, с расширением .chls, например TestLogs.chls и сохраняем.
Также можно сохранить логи в разделе Files, в формате .chls и расшарить другим тестировщикам.
Аналогично, можно импортировать чужой .chls к себе и работать с ним.
Удаляем сертификат Charles
Ранее мы ставили root-сертификат Charles. Теперь, как его удалять (это бывает нужно).
#1) Ищем на компьютере Certificate Manager (Менеджер сертификатов). В Windows он называется certmgr.msc:
#2) Когда он открылся, нажимаем Trusted Root Certification Authorities (Корневые центры сертификации), и указываем папку Сертификаты, появится их список. Процесс:
#3) Выбираем контекстное меню сертификата Charles в списке и жмем Delete.
#4) Далее подтверждаем — Yes. Сертификат удален, но если Charles будет нужен снова, придется ставить заново.
Настройка в Android
Charles работает с Android, то есть позволяет контролировать трафик на Android с компьютера. Для этого сначала нужно настроить параметры Wi-Fi на Android.
ПК с установленным Charles и Android-устройство должны быть в одной WiFi-сети.
Если вы уже когда-то работали с MITM, то вам не составит труда настроить и Charles.
Этапы
#1) Откройте Уведомления на Android-девайсе.
#2) Длительным нажатием на значке WiFi открываем Дополнительные настройки.
#3) На компьютере открываем терминал и вводим ipconfig.
#4) Там указан IP-адрес ПК, как на скриншоте ниже.
#5) Посмотреть IP можно также в Charles. Нажимаем меню Help => Local IP address, в всплывшем окне — IP.
#6) Заходим в параметры WiFi в смартфоне и долгим нажатием заходим в настройки WiFi.
#7) Modify network — изменяем эти настройки.
#8) Ставим галочку Show advanced options.
#9) Указываем Proxy — Manual.
#10) Введите имя Proxy с IP системы ПК и номер порта 8888, и Save.
#11) После сохранения настроек сети в смартфоне Charles proxy запросит подключения с девайса. Жмем Allow.
Установка root-сертификата Charles в Android
Для установки сертификата делаем следующее:
#1. На Android-устройстве устанавливаем блокировку экрана, т.е. пинкод или паттерн разблокировки телефона; блокировка должна быть
#2. Открываем Chrome на смартфоне и вводим там следующий URL-адрес.
#3. Появится запрос на ввод пароля или паттерна блокировки экрана. Введите.
#4. Сертификат загрузится.
#5. Появится запрос, укажите имя и сохраните.
#6. Настройка завершена, Charles контролирует трафик.
#7. Если в QA-задаче только трафик с мобильного девайса, снимаем галочку с проксирования в Windows:
Удаляем сертификат
- Если Charles больше не нужен, можно удалить его сертификат.
- В Настройках на Android-смартфоне находим раздел Security (Безопасность), далее ищем Trusted Credentials (Доверенные данные).
- Ищем сертификат с нужным именем и удаляем.
Платная подписка Charles Proxy
Стоимость лицензии для одного человека составляет 30$.
В триал-периоде есть ограничения:
#1) Charles вначале тупит — долго запускается с заставкой:
#2) И он закроется через полчаса, придется перезапускать.
Часто задаваемые вопросы (FAQ)
#1) Charles работает на iPhone?
Ответ: Да, здесь описание настройки.
#2) В каких ОС работает Charles?
Ответ: Работает с iOS и Windows, а читает трафик с Windows/Android/iOS.
#4) Существуют ли альтернативы?
Ответ: Да, есть MITM с похожей функциональностью. Но там довольно мало возможностей и неудобный интерфейс.
#5) Есть ли в Charles веб-интерфейс?
Ответ: Да, поддерживает веб-интерфейс. В разделе Settings => Web interface settings.
#6) Где официальная документация?
Ответ: здесь.
#7) Как отключить Charles?
Ответ: Просто нажать кнопку Stop, или закрыть приложение. Перехват сетевых вызовов будет прекращен (ничего не «пишется» втайне от пользователя).
#8) Преимущества Charles?
Ответ:
- Удобство интерфейса.
- Поддержка всех распространенных ОС.
- Возможности моделирования ограничений трафика.
- Экспорт и импорт сессий.
- Простота.
#9. Не вижу localhost-трафик.
Некоторые системы бывают hardcoded не использовать прокси для localhost-трафика. Простое решение: подключиться к http://localhost.charlesproxy.com/. Альтернативное: добавить точку после localhost, или заменить localhost именем вашей машины, или просто ввести свой IP.
#10. В ответе вижу странные символы (кодировка слетает).
Во первых, проверить кодировку/charset на сервере. Charles ее может «не угадать». Если не получается, то возможно проблема со шрифтами, изменить шрифт в Preferences или вкладке User Interface. И перезапустить Charles.
#11. Перестал работать интернет в браузере, если не запущен Charles
Дело в настройках прокси в браузере, которые вы забыли вернуть в прежний вид после работы с Charles. Или, Charles был закрыт с эксепшеном, поэтому настройки не восстановились.
#12. Charles конфликтует с антивирусом или файерволлом (что-то падает или глючит)
Лучше временно удалить антивирус/отключить файерволл.
#13. Почему такой логотип?
На кухне в компании был красивый чайничек, принадлежавший человеку по имени Чарльз.
#14. Localhost SSL-трафик с Chrome падает с ошибкой ERR_CONNECTION_CLOSED
Chrome по дефолту реджектит localhost-трафик с невалидным SSL-сертификатом. Возможно SSL-сертификат просрочен или с неправильным именем, или указан не тот нужен. Если все ок, но Chrome все равно отвергает, нужно зайти сюда: chrome://flags/#allow-insecure-localhost и включить Allow invalid certificates for resources loaded from localhost.
Как раздать VPN
Видео для утомленных чтением
Есть видеотуториалы Артема Русова:
Также мини-курс по снифферам от AlexQA (там Charles+Fiddler):
Заключение
Если вы уже имеете представление о тестировании API, пользоваться Charles довольно просто. Большинство функций интуитивны.
Подпишись на понедельничные QA-дайджесты — и там не будет рекламы
