Как называется технология которая блокирует просмотр интернет трафика мобильных приложений
Перейти к содержимому

Как называется технология которая блокирует просмотр интернет трафика мобильных приложений

  • автор:

Начинающему QA: полезные функции снифферов на примере Charles Proxy

Снифферы — это инструменты, позволяющие перехватывать, анализировать и модернизировать все запросы, которые через них проходят. Они полезны, когда из потока нужно извлечь какие-либо сведения или создать нужный ответ сервера. Так можно проводить модульное тестирование продукта, в котором есть и бэк, и фронт, и разные команды со своей версионностью.

В этой статье я расскажу об основных функциях снифферов, которые могут быть полезны QA. Попробую не вдаваться в теорию, а сфокусироваться на практике. Наиболее популярными представителями анализаторов трафика сейчас являются WhireShark, Fiddler и Charles Proxy. Об удобстве интерфейсов и функционале каждого из них можно рассуждать долго, учитывая все плюсы и минусы. Но здесь я отдал предпочтение Charles, поскольку сам им активно пользуюсь. Буду рассказывать на его примере.

Что собой представляет Charles Proxy

Charles Web Debugging Proxy — это инструмент мониторинга HTTP и HTTPS трафика. Он выступает в роли прокси-сервера (промежуточного звена) между тестируемым приложением и сервером на бэкенде, позволяя не только видеть, но также перехватывать и редактировать запросы.

Главное преимущество Charles Proxy и снифферов в целом — возможность просмотра трафика, в том числе с мобильных устройств, что значительно облегчает работу тестировщика клиент-серверных мобильных приложений.

Первичная настройка

При тестировании мобильного приложения

Charles Proxy необходимо запустить на компьютере, который находится в той же локальной подсети, что и мобильное устройство с тестируемым приложением.

Как правило, соединение настраивается по Wi-Fi. В настройках Wi-Fi мобильного устройства в качестве proxy-сервера надо указать IP-адрес компьютера и стандартный порт инструмента 8888 (пароль остается пустым).

IP-адрес компьютера можно узнать через командную строку (ipconfig) или в самом Charles Proxy (Help -> Local IP Address).

Этот же адрес есть в инструкции по подключению, доступной в Help -> SSL Proxying -> Install Charles Root Certificate on mobile device remote browser.

После сохранения настроек Charles Proxy сможет читать HTTP-трафик мобильного устройства. Но чтобы смотреть расшифрованный трафик HTTPS, нужны дополнительные манипуляции — требуется установить SSL-сертификат Charles Proxy в браузере на мобильном устройстве.

Скачать сертификат можно по адресу: chls.pro/ssl (адрес, по которому скачивается сертификат, также можно найти в инструкции Help -> SSL Proxying -> Install Charles Root Certificate on mobile device remote browser). Далее в iOS его необходимо сделать доверенным (в Настройки -> Основные -> Профили).

В Android установленные сертификаты верифицируются в Settings -> Trusted Credentials на вкладке User.

Главное отличие в настройках для этой ОС в том, что с Android 6.0 и выше в Androidmanifest надо добавить специальную конфигурацию, позволяющую просматривать защищенный трафик. На продакшене эта конфигурация убирается из соображений безопасности.

При тестировании приложения на ПК

В этом случае дополнительные сертификаты нужно установить на сам ПК. Для скачивания и установки нужна ссылка из Help -> SSL Proxying -> Install Charles Root Certificate.

Сертификат устанавливается в доверенные корневые центры.

Два слова об интерфейсе

Интерфейс Charles Proxy прост. Слева — список перехваченных запросов, справа — детали.

В списке запросов есть две основные вкладки — Structure и Sequence.

В первом случае запросы рассортированы по хостам-папкам. Наведя на любой из них, можно получить всю информацию о количестве запросов к этому корневому хосту, доле удачных, таймингах, размерах и т.п. Фактически, здесь представлена вся та же информация, которую можно получить из панели разработчика в браузере. Выбрав конкретный URL, можно увидеть код ответа, версии протоколов, контент и т.п. Тело запроса, заголовки, cookie (если есть) можно посмотреть в разных форматах — даже в HEX.

С помощью контекстного меню запроса можно настраивать блокировки, повторять и изменять запросы. На этом мы еще остановимся.

На вкладке Sequence запросы выведены по времени в виде настраиваемой таблицы. Видно, когда начался запрос, сколько он длился, его размер, статус и т.п. Наведя на конкретную строку, мы получим ту же информацию о теле, заголовках и т.п.

Если запросов на экране слишком много, с помощью панели инструментов их можно очистить или вообще остановить перехват. Там же есть возможность включить и выключить троттлинг (подробнее об этих функциях расскажу позже). Базовая настройка каждой из функций осуществляется через меню, а кнопки панели управления выступают своего рода тумблерами On / Off.

Фильтрация

В Charles Proxy очень много вариантов фильтрации запросов.

Начнем с вкладки Structure. Самое примитивное — скопировать хост и вставить в поле Filter. Так мы увидим только запросы с этого хоста. Примерно того же результата можно добиться, если в контекстном меню хоста выбрать Focus. Остальные запросы будут собраны в Other Hosts. Если при этом перейти на закладку Sequence и отметить настройку Focused, то в списке окажется информация только о тех запросах, которые были выбраны на вкладке Structure.

На вкладке Sequence есть аналогичный фильтр.

Charles Proxy умеет работать с регулярными выражениями. Для этого на вкладке Sequence выбираем Settings и отмечаем пункт Filter uses regex. И вписываем в поле поиска элементарную регулярку.

Например, вот так

можно выбрать все запросы, в которых в начале имени хоста находится четыре буквы, а потом идет точка.

Там же можно включить Autoscroll списка запросов или указать максимальное количество строк.

В Charles Proxy можно фильтровать не только отображение, но и запись запросов. Для этого надо зайти в Proxy -> Record settings и задать условия на одной из вкладок — Include или Exclude — так мы включаем или выключаем запись запросов данного хоста.

Похожего результата можно добиться, используя блок-листы. Включить хост в блок лист можно из контекстного меню (команда Block list) или через добавление в Tools -> Block list, где следует отметить Enable Block list.

Блокируемый запрос можно прервать двумя способами (подходящий надо выбрать в настройках):

  • сбросить соединение;
  • вернуть ошибку 403.

От выбранного способа блокировки зависит, какой ответ мы получим.

Можно провести эксперимент. Включим наш тестовый стенд в Block list, выбрав простой сброс соединения. С помощью контекстного меню запроса повторим его (команда Repeat) и получим такой ответ:

Статус запроса — Failed, а в описании ошибки указано, что Connection dropped.

Просмотр SSL-трафика

Если ранее мы успешно установили SSL-сертификат, для просмотра зашифрованного трафика остается только включить SSL proxying для нужного хоста в самом Charles Proxy. Это можно сделать через контекстное меню конкретного хоста.

Чтобы не включать каждый хост, можно зайти в Proxy -> SSL Proxying settings и на первой вкладке SSL Proxying включить Enable SSL Proxying.

Аналогично настройке фильтров на вкладках Include и Exclude можно добавить или исключить конкретные хосты. Если списки на этих вкладках не заполнять, по умолчанию мы будем читать трафик со всех хостов.

Брейкпоинты

Наверное, одна из самых популярных функций Charles Proxy — это настройка точек остановки, которые позволяют перехватывать запросы.

Установить Breakpoint можно из контекстного меню запроса. После этого все аналогичные запросы будут перехвачены. Их можно будет просматривать и редактировать.

Чтобы проверить, как это работает можно использовать повтор запроса (Repeat из того же контекстного меню). Запрос перехватывается, его можно редактировать.

В принципе, изменить можно все — от header до авторизационного токена. Когда редактирование будет закончено, можно выбрать Execute и в Charles Proxy появится повторный запрос, который и отправится на сервер, а потом вернется с ответом. В этот момент можно будет посмотреть и отредактировать ответ, который получит приложение — появится поле Edit response.

Редактируя запрос, можно ввести заведомо некорректные данные и посмотреть, как ответит сервер. Также можно отредактировать ответ (внеся некорректные данные) и использовать его для тестирования фронта. Можно оставить корректные данные, но изменить код — посмотреть, как фронт воспринимает информацию, переданную через API.

Map remote

Еще одна популярная функция Charles Proxy — подмена ответа сервера. Так мы можем ответ одного хоста подменить на ответ другого. Настраивается это через Tools -> Map Remote.

Обратите внимание, в левом нижнем углу есть кнопки Import и Export. Они позволяют обмениваться настройками — переносить их с одного рабочего места на другое.

Например, мы можем подменить контура. Я буду посылать запрос на dev-контур, но ответ хочу получить с тестового стенда. Для этого создаем новый пункт в списке Map Remote Settings. Map From — куда изначально был запрос; Map to — откуда берем ответ.

Эта функция может быть полезна, если мы поймали ошибку на продакшене, например при загрузке таблицы, а информации в dev-контуре для полноценного тестирования не хватает. Вместо того, чтобы перезаполнять информацию в каждом контуре, мы можем скопировать ответ сервера в нужный контур и посмотреть, как он ведет себя после исправления ошибки.

Map Local

Главное отличие Map Local от предыдущей функции в том, что замена осуществляется не на ответ другого сервера, а на содержимое локального файла. Настройки выглядят точно также, но вместо второго сервера мы указываем локальный путь к файлу с ответом.

Rewrite

Функция Rewrite может быть полезна, если вам нужно переписать данные, которые отправляются в Charles Proxy. В отличие от простого редактирования Rewrite позволяет задать правила изменения и работать в автоматическом режиме. Можно изменять и добавлять заголовки, искать и заменять текст в теле запроса или ответа. Можно даже менять статус ответа.

Rewrite удобно использовать, когда нужен готовый ответ, но мы не хотим каждый раз ставить брейкпоинт и вписывать его в ручную. Редактируя таким образом ответ, фактически, мы ставим заглушку — можем имитировать работу сторонних партнеров. Честно говоря, в Postman-е эта функция реализована более интуитивно. Но раз мы говорим про Charles, не будем отходить от его примера.

Настроить это можно через Rewrite settings, доступные в контекстном меню. Единственный недостаток инструмента в том, что каждое правило замены прописывается отдельно.

Помимо изменения запросов и ответов мы можем запретить кэширование или cookie (функции No caching и Block cookies). Эти опции повторяют аналогичные инструменты панели разработчика в браузере. В обоих случаях настраивается список хостов, для которых действует настройка. Если же список пуст, то кэширование и cookie отключаются на всех перехваченных хостах.

Throttling

Charles Proxy помогает тестировать сервис на плохой связи, искусственно ограничив через настройки пропускную способность канала. Эта функция полезнее всего для тестирования десктопных приложений, поскольку на мобильных устройствах качеством связи можно управлять через панель разработчика.

Настраивается функция через Proxy ->Throttling settings.

Ограничения можно включить либо для хостов из списка, либо для всех перехваченных запросов. Из коробки есть несколько пресетов, но все параметры связи можно корректировать вручную. Мне по большей части хватает базовых настроек.

Repeat Advanced

Хотя полноценное нагрузочное тестирование лучше проводить в специальных инструментах, Charles Proxy имеет одну базовую настройку, которая помогает закрыть минимальные потребности. Функция Repeat Advanced (доступная через контекстное меню перехваченного запроса) позволяет нужное количество раз повторить тот же запрос. После настройки откроется отдельная сессия, где будут видны детали каждого из запросов.

Конечно, список функций Charles Proxy этим не ограничивается. Есть еще много полезного — от перенаправления доменного имени на другой IP-адрес, до автоматического сохранения полученных ответов.

Отмечу, что Charles Proxy платный. Можно использовать триальную версию. Но раз в 5-7 минут поверх него будет отображаться всплывающее окно с версией, а раз в 30 минут он будет выключаться, при этом сессии не сохраняются. Решайте сами, помешает ли это вашей работе.

В целом Charles Proxy — это хороший инструмент. Не сказал бы, что он сильно отличается от того же Fiddler-а, но на мой взгляд он больше заточен под MacOS, поскольку пришел на эту платформу раньше. Хотя сейчас уже нельзя сказать, что какой-то сниффер принципиально лучше или хуже. Все они решают примерно одни и те же задачи сходным образом.

Автор статьи: Артем Холевко, Максилект.

Текст подготовлен по материалам внутреннего семинара Максилект.

P.S. Мы публикуем наши статьи на нескольких площадках Рунета. Подписывайтесь на наши страницы в VK, FB, Instagram или Telegram-канал, чтобы узнавать обо всех наших публикациях и других новостях компании Maxilect.

  • снифферы
  • charlesproxy
  • charles proxy

Charles Proxy. Обзорный гайд

Логотип Charles радикально не похож на общепринятые минималистичные иконки:

Charles Proxy логотип

«Чарли» — инструмент контроля/мониторинга трафика, который позволяет тестировать веб-приложения. Он нужен QA для анализа запросов, отправляемых приложением к серверу, и ответов. Он умеет читать трафик компьютеров под Windows, и мобильных девайсов, как Android, так и iOS. Наверное, входит в «базовый набор» тестировщика.

Настройка на десктопе

Итак, Charles «вставляется» между тестируемой программой и ее сервером и «читает» коммуникацию между ними. К примеру, когда вводите слово в Google, то ваш ПК (или смартфон) передает в Google поисковый запрос. Charles, если установлен в системе, выступает в роли посредника (или скорее «перехватчика») между приложением и сервером и отслеживает логи запросов, что полезно при разработке и тестировании приложений, которым требуется сервер (то есть практически всех современных приложений).

Что делает Charles Proxy с трафиком

Установка Charles

В браузере заходим на URL-адрес загрузки пробной версии на официальном сайте (пробника для ознакомления достаточно; для любителей экспериментов, уже немного знакомых с «Чарли», есть бета 5-й версии; но там, судя по их блогу, мало что improved, кроме каких-то сугубо визуальных improvements и iOS-дебагов). На сайте три ссылки на загрузку для различных версий ОС, т.е. для Windows, Mac и Linux. Качаем нужное:

Скачать Charles

Щелкаем на соответствующей ссылке и ждем конца загрузки.

Скачка завершена

У нас например Windows. Идем в папку Загрузки, где уже скачан установочный файл Charles-proxy-4.5.4-win64.msi (номер версии в вашем случае будет чуть больше, разница между версиями не принципиальна). Запускаем, после чего появится стандартный для Windows мастер инсталляции:

Начало установки Charles Proxy

Соглашаемся с лицензионным соглашением и нажимаем Next:

Принимаем SLA

Указываем рабочую папку

Процесс пошел

Финиш

Жмем Finish. Открываем свежепоставленное приложение Charles. Стартовое окно приведено ниже. Опция Windows proxy должна быть активирована по дефолту. Проверяем в меню Proxy:

Включаем прокси в Windows

При входе отображается структура проекта. Также можно сразу посмотреть как выглядит автоматическая запись логов.

Устанавливаем рут-сертификат

#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-прокси для одного адреса. Если нужно контролировать все подключения, то необходимо настроить еще некоторые параметры в SSL proxying.

Для этого:

#1) Щелкните в строке меню пункт Proxy и выберите пункт SSL Proxy Settings.

Уточняем настройки SSL

Там можно увидеть, что Google уже есть в списке (ведь мы его добавляли раньше).

#2) Щелкните кнопку Add и в Edit location добавляем звездочку (*) в поле Host и 443 в поле Port. Звездочка значит, что все «подобные» URL будут включены в фильтр по локации.

Прописываем правильный порт 443

Идем далее — прочие функции и настройки.

Нажимаем контекстное меню любого URL-адреса, чтобы посмотреть список доступных опций. У большинства опций название ясно отражает предназначение.

Смотрим настройки

Функциональность Charles (кнопки)

Кнопки Charles Proxy

Сверху в ленту вынесены самые используемые функции.

Пройдемся по ним.

#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 (Корневые центры сертификации), и указываем папку Сертификаты, появится их список. Процесс:

Удаление сертификата из Доверенных

Находим сертификат Charles в списке

#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:

Отключаем прокси в Windows

Удаляем сертификат

  • Если Charles больше не нужен, можно удалить его сертификат.
  • В Настройках на Android-смартфоне находим раздел Security (Безопасность), далее ищем Trusted Credentials (Доверенные данные).
  • Ищем сертификат с нужным именем и удаляем.

Платная подписка Charles Proxy

Стоимость лицензии для одного человека составляет 30$.

В триал-периоде есть ограничения:

#1) Charles вначале тупит — долго запускается с заставкой:

Заставка trial Charles Proxy

#2) И он закроется через полчаса, придется перезапускать.

Charles Proxy вылетает

Часто задаваемые вопросы (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.

Charles Proxy на пальцах: главный помощник QA и разработчиков

Привет, меня зовут Света и я тимлид Mobile QA в Emerging Travel Group. В этой статье я простым языком расскажу про один из самых полезных и простых в использовании инструментов тестирования мобильных приложений — мистер Charles Proxy, и покажу на примерах некоторые самые полезные его функции.

Для начала разберёмся, кто вообще такой этот Charles.

Charles Proxy — это сниффер (sniffer – перехватчик) трафика, инструмент для анализа трафика, который позволяет отслеживать, записывать и анализировать сетевые запросы между устройствами и интернетом.

Charles — не единственный инструмент для анализа трафика, у него есть аналоги, например: WhireShark, Fiddler, Proхyman, mitmproxy. Все они в той или иной степени про одно, различие лишь в интерфейсе, поддержке разных платформ, и наборе функционала.

Установка и первичные настройки

Я распишу процесс для MacOS, однако для Windows он практически идентичен 🙂 Для использования Charles Proxy сначала нужно выполнить следующие шаги:

  1. Скачать и установить
  2. Дать Charles установить нужные настройки сети
  3. Настроить устройства и установить на них Charles SSL сертификат

Сначала скачайте Charles Proxy для MacOS.

После загрузки Charles установите его, открыв dmg и перетащив приложение в папку «Приложения».

Charles Proxy не бесплатен, но предоставляет 30-дневный trial из-за которого Charles будет работать только 30 минут и после этого его нужно перезагружать. Чтобы работа Charles стала полноценной нужно купить его лицензию. Лицензия бессрочная и распространяется на неограниченное количество устройств.

Настройка сети

Запустите Charles, при первом запуске появится попап о запросе разрешения на изменение сетевых настроек. Если он не появился, то нажмите Shift-Command-P и увидите следующее окно:

Нажмите “Grant Priveleges” и введите пароль от своего пользователя, если его запросят. После этого Charles начнёт показывать сетевые запросы, которые отправляет ваш Mac

Настройка реального устройства для работы с Charles Proxy

Для отслеживания трафика с реального устройства через Charles Proxy ваш Mac и устройство должны находиться в одной сети. При проксировании трафика от устройства в Charles Proxy необходимо установить Charles Root SSL Certificate для того чтобы можно было анализировать трафик. Для этого открываем Charles и в меню выбираем Help -> SSL Proxying -> Install Charles Root Certificate on a Mobile Device or Remote Browser

здесь порт 8888 и IP 192.168.0.139

Теперь на устройстве открываем настройки WiFi -> Настройки выбранной сети -> Proxy Settings и вводим IP адрес и порт из окна чарльза:

экран настройки Proxy внутри выбранной Wi-Fi сети

И нажимаем “Save”.

Теперь нужно зайти в браузер и перейти на https://chls.pro/ssl и установить сертификат:

Нажимаем “Allow” и после этого видим попап о установленном configuration profile:

Теперь заходим в системное приложение Settings и там General -> Profile и нажимаем Charles Proxy CA.

Нажимаем “Install”, в появившемся окне ещё раз “Install” и после того как сертификат будет успешно установлен на экране должно быть примерно следующее:

И последнее! Теперь нужно зайти в приложение Settings, там в General -> About -> Certificate Trust Settings.

И здесь нужно включить свитчер Charles Proxy CA. На всплывающем окне нужно нажать “Continue”. Ура! Теперь установка сертификата завершена. Не волнуйтесь, эту настройку нужно делать только 1 раз на одном устройстве.

Краткий обзор интерфейса

Интерфейс Charles логичен и прост.

После того как мы настроили сертификат на устройстве, и включили запись запросов в Чарльзе, мы будем видеть абсолютно все запросы, которые отправляет приложение в сеть. Либо последовательно, либо структурно.

основной интефейс Charles Proxy

Как вы видите на скриншоте, слева у нас отображается список запросов, справа — информация о выбранном нами запросе. Остановить запись отправляемых запросов, чтобы не засорять список и не запутаться, можно нажав на красный кружочек ��

Далее, видим, что в верхней части экрана будет информация о request-части запросов, а в нижней — response-части.

Для примера я пока взяла рандомный запрос, далее рассмотрим подробнее на одном из приложений, с которыми я работаю.

При нажатии на один из запросов мы можем увидеть некоторые детали запроса, например, заголовки, тело и другое. Мы также можем увидеть ответ на данный запрос.

Однако, есть один нюанс: если запрос выполняется через HTTPS, мы не увидим никаких подробностей в этих запросах, по крайней мере пока не включим SSL-проксирование для определенного хоста или всех запросов, выполняемых приложением. После включения можно будет проверять содержимое этих запросов.

Как включить ssl-проксирование для интересного нам хоста?
Сharles > Proxy > SSL Proxying Settings…
Выбираем вкладку SSL Proxying, нажимаем на Add.

Вставляем интересующий нас хост (обратите внимание, только хост, без https и query-параметров), в моём случае это один из хостов приложения Dice и порт 443.

Теперь, когда я запущу на своём устройстве приложение Dice, я буду видеть все внутренности запросов с этого хоста ��

Теперь давайте перейдём непосредственно к нескольким функциям, которые сильно облегчают жизнь в разработке и тестировании.

Волшебные функции

1. Breakpoint

Breakpoint — дает возможность приостановить выполнение запроса или ответа на определенном этапе и проанализировать содержимое для того, чтобы можно было внести необходимые изменения и проверить как приложение или сервер отреагируют на внесённые нами изменения. Звучит, вероятно, слегка сложно, но на примере всё будет сильно понятнее.

Breakpoint можно использовать, чтобы изменить URL запроса на сервер, заменить один заголовок на другой, изменить содержимое тела запроса или ответа или добавить новый параметр в URL запроса.

Функция Breakpoint позволяет остановить выполнение на следующих этапах запроса или ответа:

  1. Запрос перед отправкой на сервер
  2. Ответ после получения от сервера
  3. Загрузка ресурсов (например, изображений или стилей) Рассмотрим на простом примере одного из приложений, с которыми я работаю: Пользователь забронировал себе трансфер. У нас есть экран подтверждения его бронирования, с данными, которые он указал. Что мы можем сделать с помощью брейкпоинта? Поменять практически любые данные, которые приходят в запросе для этого экрана, и посмотреть, как новые данные будут выглядеть. Для примера, давайте поменяем имя пользователя, который трансфер. Вот такой экран мы имеем на старте (все данные вымышленные):

Для начала, нам нужно понять, в каком запросе хранится информация об имени.

слева endpoint, в котором лежит поле с именем, которое нам нужно

Теперь правой кнопкой мыши нажимаем на нужный нам запрос и в выпадающем меню выбираем Breakpoints.

Видим, что наш брейкпоинт добавлен, функция “отлова” сейчас включена, и при следующей отправке этого запроса он “перехватится”.

Так как нужная нам информация хранится именно в Response-части запроса, менять мы будем именно её. Request-часть не трогаем.

Итак, запускаем приложение ещё раз, и доходим до нужного нам запроса.

Когда приложение отправит запрос, на который мы поставили брейкпоинт, Чарльз уведомит нас об этом:

Сначала Чарльз всегда предлагает изменить Request-часть, но в ней нам не нужно ничего менять, поэтому нажимаем Execute, и дальше Чарльз предложит изменить Response-часть, как раз то что нам нужно. Вот там-то мы нажимаем “Edit response” и доходим до того самого места, где лежит имя нашего пользователя, и меняем его.

Поменяли, и теперь нажимаем Execute.

Важно! Время, на которое запрос перехватывается, ограничено, и нам нужно успеть поменять всё, что мы хотим поменять, примерно за 30 секунд (точное время зависит от того, какой таймаут поставили разработчики для отработки этого запроса), иначе запрос просто отработает без изменений.

Что мы видим на экране приложения теперь?

Ивана с уже новой фамилией ��

Таким образом можно менять любую информацию в теле и ответе запроса, можно менять значения хэдеров, можно менять коды ответов, например, если мы хотим посмотреть, как будет выглядеть ошибка в приложении, мы можем поменять код ответа с 200 на 500.

2. Rewrite

Функция Rewrite по смыслу похожа на Breakpoint за исключением того, что Rewrite позволяет изменять и перезаписывать запросы и ответы перед их отправкой и получением соответственно, а не ВО ВРЕМЯ, как Breakpoint.

Давайте снова рассмотрим на примере нашего путешественника, заказавшего себе трансфер. Мы снова хотим поменять ему имя, но только теперь не во время запроса, а заранее.

В меню Charles переходим в Tools > Rewrite > Add

Добавляем новый сет, задаём ему название, и теперь нужно прописать, где, что и на что мы хотим поменять.

В верхней части прописываем путь до нужного нам места, значение которого нам нужно изменить, в нижней части указываем что и на что меняем. Остановимся подробнее на втором:

Здесь мы указываем, что хотим поменять Ивана Сидорова на Сидора Иванова

В типе выбираем “Body”, так как нужный нам параметр лежит именно в теле ответа. Далее Response, потому что в теле ответа. И далее мы знаем, что на самом деле пользователя зовут Ivan Sidorov, а мы хотим назвать его по-другому. ОК.

Запускаем наше приложение, доходим до нужного экрана, и что мы видим:

Иван Сидоров больше не Иван Сидоров

И так теперь будет каждый раз, когда мы будем открывать этот экран, пока мы не отключим функцию Rewrite. И не надо каждый раз руками менять это, как в Breakpoints.

Кстати, в одном сете Rewrite менять можно не только одно значение, а сразу несколько. Достаточно в настройках сета нажать на кнопку Add, и добавить другие условия.

Rewrite также можно использовать для перенаправления трафика, достаточно вместо Body, там где мы выбрали Body, выбрать Host и настроить параметры под него.

Этот метод не лучше и не хуже. Breakpoint хорош, если нам нужно проверить несколько разных значений подряд. Rewrite хорош, если мы заранее знаем, на какое значение нам нужно подменить тот или иной параметр, и знаем, что он нам понадобится несколько раз, чтобы каждый раз не вбивать его руками в условиях ограниченного времени.

3. Map remote

Наконец, последняя в моём сегодняшнем списке, но не последний по важности, функция Map remote.

Map Remote позволяет перенаправить трафик с одного хоста на другой по настраиваемым правилам.

Вот житейский пример:

Приложение ходит за данными по адресу https://backend.service.com.
Команда бекенд-разработчиков делали задачу на фикс какого-нибудь бага, сделали ветку с изменениями этого бэкенда и хотят протестировать его до слива этой ветки в мастер, на всех. Адрес отдельного домена https://new-backend.service.com

Нам нужно протестировать как приложение будет работать с бэкендом с новыми изменениями от разработчиков.

В такой ситуации можно прийти к разработчикам приложения и попросить чтобы они сделали специальную версию приложения, которое будет ходить в новый бэкенд, но для этого нужно отвлекать разработчиков, ждать пока они это сделают.

С помощью Map Remote можно перенаправить трафик приложения без внесения изменений в код.

Итак, идём в Charles > Tools > Map Remote > Enable Map Remote > Add

закрасила кусок моего реального хоста

Теперь, когда мы запустим наше приложение и посмотрим в список запросов, мы увидим, что запросы идут не в обычный хост, а в тот, на который мы сделали перенаправление. И всё, что мы видим в приложении теперь, происходит с учётом тех изменений, которые сделали господа бекендеры в своей ветке-хосте.

Подытожим

В этой статье мы рассмотрели три, на мой взгляд, основные и самые ходовые функции Charles Proxy. Конечно, это только малая часть того, что может этот славный товарищ.

Ещё раз подчеркну, что Charles является незаменимым помощником для разработчиков и тестировщиков как мобильных, так и вэб-приложений.

Это мощный и гибкий инструмент, который может значительно упростить процесс тестирования мобильных приложений и помочь выявлять ошибки и уязвимости в приложении. Использование Charles Proxy может сократить время, затраченное на тестирование, и улучшить качество мобильного приложения в целом.

Подробнее с функционалом можно ознакомиться на официальном сайте (у них, к слову, довольно понятная и подробная документация, если вы владеете английским).

Ну а я желаю вам успешного тестирования, наслаждайтесь этими и узнавайте другие функции этого замечательного инструмента ��

  • снифферы
  • тестирование мобильных приложений
  • тестирование api
  • Разработка мобильных приложений
  • Тестирование веб-сервисов
  • Тестирование мобильных приложений

Как приручить Charles Proxy?

Привет! Многие из тех, кто приходит к нам на собеседование на должность тестировщика, с гордостью заверяют, что они могут пользоваться Charles Proxy. Но когда погружаешься в техническую часть, то становится очевидно, что кандидат только слышал об этом инструменте. Давайте уже наконец скорее приручим эту вазу!

Википедия нам сообщает, что:

Charles представляет собой кроссплатформенное приложение прокси-сервера для отладки HTTP, написанное на Java. Он позволяет пользователю просматривать HTTP, HTTPS и активированный трафик TCP-порта, доступ к которому осуществляется с локального компьютера, на него или через него. Сюда входят запросы и ответы, включая HTTP-заголовки и метаданные (например, файлы cookie, кэширование и кодирование информации), с функциями, предназначенными для помощи разработчикам и тестировщикам в анализе соединений и обмене сообщениями.

Небольшое пояснение

Сниффинг — процесс мониторинга и перехвата всех пакетов, проходящих через сеть, с помощью инструментов сниффинга (Charles Proxy).

Первые шаги

1. Установка и запуск

Для начала необходимо загрузить и установить приложение.

Если у вас не приобретена лицензия, то будет доступна 30-ти дневная пробная версия с ограничениями (функциональность не блокируется, но будут появляться окна с таймаутом 5-10 секунд до возобновления использования, а также через 30 минут будет завершаться работа приложения).

2. Начинаем сниффить трафик

Запустите Charles Proxy на MAC, зайдите в меню HelpSSL ProxyingInstall Charles Root CertificateУстановить сертификатИмпортируем сертификат.

Запустите Charles Proxy на Windows, зайдите в меню HelpSSL ProxyingInstall Charles Root Certificate

В Windows, в открывшемся окне СертификатУстановить сертификат. Выбрать «Текущий пользователь» или «Локальный пользователь». Далее вы получите уведомление от мастера импорта сертификатов, что сертификат успешно импортирован.

3. Проксирование трафика веб-браузера

Рассмотрим вариант с проксированием на примере браузера Mozilla Firefox. И установку сертификата на примере двух OS: MAC и Windows.

3.1 Windows
Для этого узнаем IP-адрес ПК: в Charles Proxy перейдем в HelpLocal IP Address. Видим, что ваш IP: 10.0.2.15 (p.s. в Local IP Address может быть несколько указано IP, например отображаться IP от VirtualBox, если после указания одного IP не будут отображаться запросы, попробуйте выбрать другой из списка).

Далее откроем Mozilla Firefox, перейдем в Параметры сетиНастроить. Выставим все как на скриншоте ниже и нажмем Ок.

Теперь необходимо перейти по ссылке chls.pro/ssl, а далее начнется автоматическая загрузка сертификата. В этот момент будет входящее соединение в Charles Proxy, необходимо нажать Allow, а также выполнить импорт сертификата:

3.2 MAC OS
Для этого узнаем IP-адрес ПК: в Charles Proxy перейдем в HelpLocal IP Address. Видим, что ваш IP: 192.168.1.50 .

Далее откроем Mozilla Firefox, перейдем в Параметры сетиНастроить.

Выставим все как на скриншоте и нажмем Ок.

Теперь необходимо перейти по ссылке chls.pro/ssl, а далее начнется автоматическая загрузка сертификата.

В этот момент будет входящее соединение, необходимо нажать Allow:

Следующим шагом обратите внимание на диалоговое окно, где необходимо выбрать Открыть в keychain:

Важным шагом, который вы должны сделать далее, это в Keychain Access сделать сертификат доверенным:



Не забудьте деактивировать Windows Proxy (если у вас ОС Windows) или Mac Proxy (в противном случае будет вам мешать).

Теперь у вас отображаются запросы, однако они зашифрованы, и кроме иероглифов ничего не видно. Чтобы видеть Request/Response в нормальном виде, нужно включить SSL Proxying и настроить домены, пакеты которых мы хотим перехватывать. А хотим мы получать запросы со всех сайтов. Для этого перейдите в раздел ProxySSL Proxying Settings.

В открывшемся диалоговом окне поставьте галочку Enable SSL Proxying, выберите раздел Include и нажмите Add.

Далее заполните поле Host значением * (как показано на скриншоте) и нажмите ОК.

В диалоговом окне «SSL Proxying Settings» нажмите ОК.

Если необходим будет определенный host, следует указать например нужный *youla* (это значит, что будет расшифровываться трафик только тот, где в запросах есть youla.

4. Настройка прокси на Android

Чтобы отображались запросы приложения Android, у вас должна стоять соответствующая сборка Android-приложения, c установленным в манифесте разрешением. Давайте представим, что такое приложение имеется, и мы хотим начать получать его трафик. Важно: устройство Android и десктоп должны быть в одной сети.

Для этого узнаем IP-адрес ПК: в Charles Proxy перейдем в HelpLocal IP Address. Видим, что ваш IP: 192.168.1.50 .

Далее возьмите в руки телефон, откройте Свойства сети → Название сети WiFi → Прокси-сервер → Вручную → Имя хоста: *ваш IP* / Порт: *8888* → Сохраните измененные свойства сети.

Теперь необходимо перейти по ссылке chls.pro/ssl или charlesproxy.com/getssl, а далее начнется автоматическая загрузка сертификата. Откройте его, задайте имя сертификата, и теперь у вас есть доступ к трафику Android-приложения.

5. Настройка прокси на iOS

Возьмите в руки iPhone, откройте Свойства сети → Название сети WiFi → Прокси-сервер → Вручную → Имя хоста: *Наш IP* / Порт: *8888* → Сохраните измененные свойства сети (важно: устройство iOS и десктоп должны быть в одной сети).

Теперь необходимо перейти по ссылке chls.pro/ssl или charlesproxy.com/getssl, «Разрешить» загрузку профиля конфигурации. Далее перейдите в НастройкиПрофиль загруженУстановить. Затем перейдите в НастройкиОсновныеОб этом устройствеДоверие сертификатам → найдите установленный сертификат и сделайте его «Доверенным».

Функциональность Charles Proxy

  1. Подмена данных:
    • 1.1 Breakpoint
    • 1.2 Rewrite
    • 1.3 Map Local
  2. Proxy:
    • 2.1 Throttle Settings
    • 2.2 Reverse Proxies
    • 2.3 Port Forwarding
    • 2.4 MacOS Proxy/Windows Proxy
  3. Tools:
    • 3.1 No Caching
    • 3.2 Block Cookies
    • 3.3 Map Remote
    • 3.4 Block List
    • 3.5 DNS Spoofing
    • 3.6 Mirror
    • 3.7 Compose
  4. Recording Settings
  5. Focus
  6. Repeat
  7. Repeat Advanced

1. Подмена данных

Представим, что нам надо протестировать на клиенте верстку. Нужно проверить, как будет отображаться большое количество бонусов у пользователя. Один из вариантов, который многие предложат: изменить в БД количество бонусов и проверить на клиенте. Да, вы будете правы! Однако на сервере может быть кэш, и необходимо подождать какое-то время, пока количество бонусов не обновится, либо просто подключиться к самой базе и выполнить запрос — это занимает определенное время. Есть вариант проще: изменить ответ от сервера! В Charles Proxy есть три способа подмены данных:

1.1 Breakpoint

Breakpoint — это некая точка остановки запроса. Когда обнаруживается запрос из заданного списка, для дальнейшего ручного взаимодействия с параметрами запроса открывается отдельное окно. В нём перейдите к ручному изменению запросов и ответов. Удобно использовать эту функцию, когда тестируете API или разные ответы сервера.

У нас имеется приложение и профиль пользователя, у которого сейчас 45 бонусов на счету:

Запрос, в котором приходит это количество бонусов: https://api.youla.io/api/v1/user/5e6222bbbedcc5975d2375f8

Чтобы «повесить» Breakpoint на запрос, перейдите в раздел ProxyBreakpoint Settings. Далее поставьте галочку Enable BreakpointsAdd, и в открывшемся диалоговом окне «Edit Breakpoint» вставьте URL запроса, как показано на скриншоте:

Для примера поставьте две галочки «Request» и «Response». Далее нажмите OK, и ещё раз OK в окне «Breakpoint Settings». Теперь выполните запрос еще раз, то есть на клиенте заново откроется экран с профилем пользователя.

В Charles Proxy мы видим, что выполнение запроса ставится на паузу:

Здесь можно изменить параметры запроса. Но сейчас это делать не нужно, нажмите «Execute». Следом у нас ставится на паузу уже пришедший ответ от сервера. И тут как раз мы должны отредактировать «Response». Найдите нужный параметр — bonus_cnt»: 45 .

Далее измените значение параметра bonus_cnt , например, на 1 000 000 бонусов, и нажмите «Execute».

На клиенте отобразится новое количество бонусов. Мы богаты!

1.2 Rewrite

Rewrite — это инструмент, позволяющий создавать правила, которые изменяют запросы и ответы, когда те проходят через Charles Proxy. Например, можно добавлять и изменять заголовок, искать и заменять текст в теле ответа или запроса, и т.д.

Попробуем с помощью Rewrite изменить количество бонусов нашего пользователя. Для этого откройте ToolsRewrite → галочка «Enable Rewrite» → Add. В поле Name можно ввести любое название подмены, например, «Change bonus», либо оставить по умолчанию «Untitled Set».

Следующим шагом необходимо добавить в «Location» путь запроса. Для этого, в разделе LocationAdd заполните следующие поля и сохраните:

Host: https://api.youla.io

Path: /api/v1/user/5e6222bbbedcc5975d2375f8

После того, как вы добавили путь запроса, необходимо изменить сам параметр и его значение. Для этого нужно создать Rewrite Rule:

Type: Body (потому что параметр находится в теле);

Where: Response (потому что параметр находится в ответе от сервера);

Раздел Match: в «Value» укажите значение и параметр, который возвращает сервер;

Раздел Replace: в «Value» укажите значение и параметр, который вы хотите увидеть на клиенте.

Далее сохраните «Rewrite Rule» и нажмите ОК на вкладке «Rewrite Settings». На клиенте перезапросите еще раз профиль пользователя. У вас автоматически подменилось количество бонусов пользователя. Мы снова богаты!

1.3 Map Local

Map Local — инструмент, который позволяет использовать локальные файлы, словно они являются частью сервера.

Перейдите в Tools → Map Local.

Далее в окошке «Map Local Settings» нажмите Add → Хост: https://api.youla.io/api/v1/user/5e6222bbbedcc5975d2375f8 → Local path: путь на компьютере до файла. Можете использовать готовые медиа-файлы, HTML, CSS, JSON, XML. Больше подходит, конечно, разработчикам, чтобы не загружать данные на сервер для его последующего тестирования, но и тестировщик может найти грамотное применение. Мы заранее подготовили ответ, который нам будет нужен, и сохранили в файл change_bonus.json:

Сохраните введенные значения на вкладке «Edit Mapping» и на вкладке «Map Local Settings».

На клиенте перезапросите еще раз профиль пользователя. У вас автоматически подменилось количество бонусов пользователя. Мы снова богаты!

Давайте рассмотрим другие возможности инструмента Charles Proxy. И начнем с самого начала, с вкладки «Proxy».

2.1 Throttle Settings

Throttle Settings — функция, позволяющая задавать разные параметры скорости соединения с выбранным доменом.

Функция для тех, кто любит тестировать в лифте, в метро, в подземном переходе. Перейдем в ProxyThrottle Settings → галочка Enable Throttling. Если не разбираетесь во всех перечисленных пунктах, то можете использовать Throttle preset и там выбрать подходящую для теста скорость, а система автоматически заполнит остальные поля.

Если выбрать «Only for selected hosts», то можно задать определенный хост, к которому будут применяться ваши настройки. Здесь можно использовать готовые пресеты с настройками для различных типов (4G, 3G и т. д.). А также можно задать различные параметры, коротко перечислю некоторые из них:

Bandwidth — максимальный объем данных, который может быть передан с течением времени.

Utilisation — доля общей пропускной способности, которая может быть предоставлена пользователю в любой момент времени.

Latency — задержка в миллисекундах по запросу firts между клиентом и удаленным сервером.

MTU — максимальное передающее устройство для текущего пресета.

Reliability — мера вероятности, что соединение не удастся. Используется для имитации ненадежных сетевых условий.

Stability — мера вероятности, что соединение будет нестабильным и, следовательно, снизится качество. Полезно для моделирования сетей, в которых периодических падает качество связи, например, мобильных.

2.2 Reverse Proxies

Reverse proxy — обратный прокси-сервер. Обычно используется для того, чтобы принимать запросы из Интернета и перенаправлять их на один из веб-серверов.

2.3 Port Forwarding

Port Forwarding — проброс портов, который иногда называют перенаправлением портов, или туннелированием — процесс пересылки трафика, адресованного конкретному сетевому порту, с одного сетевого узла на другой. Этот метод позволяет внешнему пользователю достичь порта внутри локальной сети.

2.4 MacOS Proxy/Windows Proxy

MacOS Proxy или Windows Proxy (в зависимости от вашей ОС) — проксирование трафика с вашего веб-браузера.

Разобравшись с разделом Proxy, перейдем к разделу Tools.

3.1 No Caching

Инструмент No Caching предотвращает кэширование, манипулируя заголовками HTTP, которые управляют кэшированием ответов. Заголовки If-Modified-Since и If-None-Match удаляются из запросов, добавляются Pragma: no-cache и Cache-control: no-cache . Заголовки Expires , Last-Modified и ETag удаляются из ответов и добавляются Expires: 0 и Cache-Control: no-cache .

3.2 Block Cookies

Block Cookies — заголовок файла Cookie удаляется из запросов, предотвращая отправку значений файла из клиентского приложения (например веб-браузер) на удаленный сервер. А также из ответов удаляется заголовок Set-Cookie, предотвращая получение клиентским приложением запросов на установку файлов cookie с удаленного сервера. В настройках можно включить удаление Cookie как для всех хостов, так и для выбранных. В примере ниже включено удаление Cookie для всех запросов.

3.3 Map Remote

Map Remote — позволяет переадресовать запросы с одного URL «Map From» на другой «Map To». Подменяет хост, путь целиком или только параметры в зависимости от вашей задачи. В примере ниже подменён запрос с prod-сервера на dev-сервер.

3.4 Block List

Block List — позволяет блокировать определённые доменные имена. Когда веб-браузер попытается запросить любую страницу из заблокированного доменного имени, она заблокируется. Можно выбрать либо «Drop connection», либо возврат 403 ошибки.

3.5 DNS Spoofing

Виртуальный хостинг — это когда у вас есть несколько сайтов на одном IP-адресе, и веб-сервер определяет, какой сайт вы запрашиваете, основываясь на имени, введённом в браузере. Точнее, сервер смотрит на заголовок хоста, отправленный в запросе. Например, когда нужно подменить хосты, чтобы при вводе какого-либо адреса в браузере (скажем, api.youla.ru) запросы уходили по другому адресу (допустим, на тестовую площадку).

DNS Spoofing — перенаправляет доменное имя на определенный IP-адрес.

3.6 Mirror

Mirror — эта функция позволяет автоматически сохранять все ответы, возвращаемые в Charles Proxy. Они раскладываются локально в такой же иерархии, как на сервере. Если внезапно случился даунтайм на бэкенде, отвалилась тестовая среда и т. д., у вас уже есть готовые моки для Map Local. Активировать функцию можно так: ToolsMirror или ToolsAuto Save.

3.7 Compose

Compose — функция редактирования запросов, которые вы поймали.

Например вы добавляете в избранное какой-то товар, но почему-то он не добавляется. Вы можете отредактировать уже отправленный запрос и отправить его еще раз. Для этого необходимо выбрать нужный запрос из списка, нажать на нём правой кнопкой и выбрать Compose. Иконка у запроса поменяется, и теперь можно смело его редактировать.

После того, как вы изменили нужные значения в запросе, нажмите внизу «Execute», чтобы отправить запрос на сервер.

4. Recording Settings

Recording Settings — настройки отображения списков разрешенных и запрещенных доменов.

Во вкладке «Options» можно настроить лимит, то есть количество запросов, которое Charles Proxy может записать.

Во вкладке «Include» можно выбрать конкретный домен для отображения пакетов.

Во вкладке «Exclude» можем выбрать те домены, которые необходимо спрятать при сниффинге.

5. Focus

Focus — эта функция перемещает домен на первые позиции в списке.

6. Repeat

Repeat — отправляет на сервер запрос, идентичный выбранному.

7. Repeat Advanced

Repeat Advanced — идентично Repeat, только можно выбрать количество отправляемых запросов и задержку между ними. Эта функция пригодится при проверке реакции сервера на флуд.

Здесь Concurrency — количество пользователей, а Iterations — количество повторений каждого запроса. Также можно поставить галочку «Show results in new Session», в таком случае откроется новое окно, где будут выполняться запросы.

Резюме

В этой статье мы постарались описать те функции Charles Proxy, которыми пользуются тестировщики мобильных приложений. На этом всё, и не забывайте прикреплять к баг-репорту сессию из сниффера. А если остались вопросы — скорее пишите в мой телеграм-канал @qa_chillout

  • Charles Proxy
  • тестирование мобильных приложений
  • прокси
  • Блог компании Юла
  • Тестирование мобильных приложений

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *