Rewrite charles как пользоваться
Привет! Многие из тех, кто приходит к нам на собеседование на должность тестировщика, с гордостью заверяют, что они могут пользоваться Charles Proxy. Но когда погружаешься в техническую часть, то становится очевидно, что кандидат только слышал об этом инструменте. Давайте уже наконец скорее приручим эту вазу!
Википедия нам сообщает, что:
Небольшое пояснение
Сниффинг — процесс мониторинга и перехвата всех пакетов, проходящих через сеть, с помощью инструментов сниффинга (Charles Proxy).
7. Repeat Advanced
Repeat Advanced — идентично Repeat, только можно выбрать количество отправляемых запросов и задержку между ними. Эта функция пригодится при проверке реакции сервера на флуд.
Здесь Concurrency — количество пользователей, а Iterations — количество повторений каждого запроса. Также можно поставить галочку «Show results in new Session», в таком случае откроется новое окно, где будут выполняться запросы.
Функциональность Charles Proxy
- Подмена данных:
- 1.1 Breakpoint
- 1.2 Rewrite
- 1.3 Map Local
- Proxy:
- 2.1 Throttle Settings
- 2.2 Reverse Proxies
- 2.3 Port Forwarding
- 2.4 MacOS Proxy/Windows Proxy
- 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
- Recording Settings
- Focus
- Repeat
- Repeat Advanced
7. Repeat Advanced
Repeat Advanced — идентично Repeat, только можно выбрать количество отправляемых запросов и задержку между ними. Эта функция пригодится при проверке реакции сервера на флуд.
Здесь Concurrency — количество пользователей, а Iterations — количество повторений каждого запроса. Также можно поставить галочку «Show results in new Session», в таком случае откроется новое окно, где будут выполняться запросы.
Как менять запросы и ответы
Задача: на лету изменить параметр в заголовке или в теле запроса и посмотреть, что вернёт сервер, либо наоборот, модифицировать ответ сервера, чтобы проверить как поведет себя клиент.
В этом случае можно использовать инструмент Rewrite (Tools – Rewrite – галочка Enable Rewrite.
Добавьте новое правило, введите хост (или оставьте пустым, тогда правило будет действовать для всех хостов), затем заполните Rewrite Rule, где укажите что на что необходимо заменить.
В примере ниже, значение поля bonus в теле ответа будет заменено со 100 на 5000.
Еще задача: допустим есть лента с контентом (видео, реклама, музыка) и при тестировании нужно быстро изменить его источник без вмешательства разработчика.
В разделе Match можно использовать регулярные выражения.
Аналогичным способом через Rewrite можно изменять, добавлять, удалять заголовки, менять коды ответа сервера, хосты и url.
Как раздать VPN
Задача: дать доступ другому устройству в корпоративную сеть.
Если компьютер с установленным Charles имеет доступ к сети VPN, то и устройства, трафик которых проксируется, будут иметь доступ к той же сети.
1. Подмена данных
Представим, что нам надо протестировать на клиенте верстку. Нужно проверить, как будет отображаться большое количество бонусов у пользователя. Один из вариантов, который многие предложат: изменить в БД количество бонусов и проверить на клиенте. Да, вы будете правы! Однако на сервере может быть кэш, и необходимо подождать какое-то время, пока количество бонусов не обновится, либо просто подключиться к самой базе и выполнить запрос — это занимает определенное время. Есть вариант проще: изменить ответ от сервера! В Charles Proxy есть три способа подмены данных:
1.1 Breakpoint
У нас имеется приложение и профиль пользователя, у которого сейчас 0 бонусов на счету:
Чтобы «повесить» Breakpoint на запрос, перейдите в раздел Proxy -> Breakpoint Settings. Далее поставьте галочку Enable Breakpoints -> Add, и в открывшемся диалогом окне «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 изменить количество бонусов нашего пользователя. Для этого откройте Tools -> Rewrite -> галочка «Enable Rewrite« -> Add. В поле Name можно ввести любое название подмены, например, «Change bonus», либо оставить по умолчанию «Untitled Set».
Следующим шагом необходимо добавить в «Location» путь запроса. Для этого, в разделе Location -> Add заполните следующие поля и сохраните:
Path: /api/v1/user/5e6222bbbedcc5975d2375f8
После того, как вы добавили путь запроса, необходимо изменить сам параметр и его значение. Для этого нужно создать Rewrite Rule:
Type: Body (потому что параметр находится в теле);
Раздел Match: в «Value» укажите значение и параметр, который возвращает сервер;
Раздел Replace: в «Value» укажите значение и параметр, который вы хотите увидеть на клиенте.
Далее сохраните «Rewrite Rule» и нажмите ОК на вкладке «Rewrite Settings». На клиенте перезапросите еще раз профиль пользователя. У вас автоматически подменилось количество бонусов пользователя. Мы снова богаты!
1.3 Map Local
Map Local — инструмент, который позволяет использовать локальные файлы, словно они являются частью сервера.
Перейдите в Tools -> Map Local.
Сохраните введенные значения на вкладке «Edit Mapping» и на вкладке «Map Local Settings».
На клиенте перезапросите еще раз профиль пользователя. У вас автоматически подменилось количество бонусов пользователя. Мы снова богаты!
Давайте рассмотрим другие возможности инструмента Charles Proxy. И начнем с самого начала, с вкладки «Proxy».
2.1 Throttle Settings
Throttle Settings — функция, позволяющая задавать разные параметры скорости соединения с выбранным доменом.
Функция для тех, кто любит тестировать в лифте, в метро, в подземном переходе. Перейдем в Proxy -> Throttle 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
3.2 Block Cookies
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
DNS Spoofing — перенаправляет доменное имя на определенный IP-адрес.
3.6 Mirror
Mirror — эта функция позволяет автоматически сохранять все ответы, возвращаемые в Charles Proxy. Они раскладываются локально в такой же иерархии, как на сервере. Если внезапно случился даунтайм на бэкенде, отвалилась тестовая среда и т. д., у вас уже есть готовые моки для Map Local. Активировать функцию можно так: Tools -> Mirror или Tools -> Auto Save.
3.7 Compose
Compose — функция редактирования запросов, которые вы поймали.
Map Local
Последняя функция в сегодняшней статье. Позволяет работать с локальными файлами.
Демонстрация инструмента ниже.
ПКМ по запросу -> Map Local.
В открывшемся окне у нас идут знакомые поля. Жмем «Choose» и выбираем локальный файл, после чего жмем « OK » .
При повторном получении того же запроса Charles будет перенаправлять его на локальный файл.
Надеюсь, эта статья помогла вам разобраться в основах Charles. Это действительно мощный и довольно простой инструмент для тестирования. Спасибо за внимание!
6. Repeat
Repeat — отправляет на сервер запрос, идентичный выбранному.
Установка и предварительная настройка
Установка и запуск
Скачайте и установите Charles .
При первом запуске Charles скорее всего попросит разрешения внести изменения в сетевые настройки вашего компьютера, согласитесь.
Настройка прокси
Далее перейдите в Proxy – Access Control Setting, нажмите кнопку Add и добавьте IP-адрес 0.0.0.0/0.
Установите сертификаты на компьютер: Help – SSL Proxying – Install Charles Root Certificate.
Укажите порт: Proxy – Proxy Settings – вкладка Proxies – Port: 8888.
Проксирование трафика веб-браузера
Если не хотите видеть запросы с ПК, перейдите на вкладку MacOS (Windows) и снимите чекбоксы. Но если целью является изучение трафика из браузера, наоборот, удостоверьтесь, что чекбоксы установлены.
Когда закончите с настройками прокси, перезапустите Charles.
Настройка прокси на устройстве
Если целью является изучение трафика с устройства, например со смартфона, нужно выполнить на нем дополнительные настройки.
Компьютер с Charles и устройство должны находиться в одной сети.
На устройстве, в настройках сети или Wi-Fi, укажите прокси-сервер: IP-адрес компьютера с запущенным Charles и порт 8888, или другой, который был указан при настройке прокси.
Быстро узнать IP-адрес компьютера с запущенным Charles можно через пункт меню Help – Local IP Address.
Для iPhone откройте Настройки (Settings), перейдите в настройки Wi-Fi, выберите активную Wi-Fi сеть, пролистайте экран вниз и выберите пункт Настройка прокси (Configure Proxy). Метод определения выберите Вручную (Manual) и укажите IP-адрес и порт.
Далее нужно установить сертификат прокси-сервера.
Установите скачанный сертификат Charles. Процесс установки зависит от используемого устройства и может различаться.
Например, чтобы установить сертификат на iPhone откройте Настройки (Settings), перейдите в Основные (General), пролистайте вниз и выберите пункт Профили и управление устройством (Profiles & Device Management). В открывшемся меню найдите загруженный профиль сертификата, откройте его, а затем установите.
Дополнительно может потребоваться установить доверие сертификату. Откройте Настройки (Settings) – Основные – Об этом устройстве (About), пролистайте вниз до конца, выберите пункт Доверие сертификатов (Certificate Trust Settings). В открывшемся окне отметьте переключателем сертификат, которому хотите дать доверие.
Для Android действия будут похожими, за исключением того, что дополнительно не потребуется указывать доверие сертификату, его достаточно будет лишь установить.
Подробнее про установку сертификатов можно прочитать в документации Charles.
Теперь можно проксировать и изучать трафик.
Rewrite
Если же ваша задача заключается в подмене параметров множества запросов, то вы можете прибегнуть к функции « Rewrite » .
Открываем Tools -> Rewrite.
Ставим галочку на «Enable Rewrite», затем в открывшемся окне под левым полем жмем «Add», а дальше жмем «Add» уже под правым верхним полем.
Заполняем все поля (они идентичны тем, что заполняются при создании Breakpoint).
Затем жмем «Add» уже под правым нижним полем, указываем тип редактирования запроса, заменяемые значения, а также условия замены.
Давайте поймаем запрос и посмотрим на реакцию Charles!
Charles поймал нужный запрос, а затем заменил все Header одним значением.
Как вручную отредактировать запрос
Задача: перехватить запрос (ответ) и перед отправкой (приемом) его отредактировать. Отличие от предыдущей задачи заключается в том, что в ней данные менялись на лету по заранее заданному шаблону, здесь же редактирование осуществляется вручную.
Запросы можно редактировать используя инструмент Compose. Прежде нужно, чтобы запрос выполнился хотя бы один раз. Найдите его среди остальных запросов. В контекстном меню выберите Compose.
В открывшемся окне можно изменить тело запроса, метод, протокол, url, параметры, заголовки и куки. Затем нужно нажать кнопку Execute и запрос будет отправлен с новыми данными.
Инструмент Repeat в контекстном меню запроса отправит его на сервер еще раз.
Repeat Advanced – похож на Repeat, однако позволяет указать количество отправляемых запросов и задержку между ними. Данный функционал может быть полезен при проверке сервера на флуд.
С помощью инструмента Breakpoints (точки остановка) можно перехватывать и изменять не только запросы, но так же и ответы от сервера, прежде чем они попадут на клиент.
Для начала нужно включить возможность использования Breakpoints (Proxy – Breakpoint Settings – Enable Breakpoints).
Далее нужно указать URL запроса, который в случае выполнения должен быть перехвачен. Это можно сделать в том же окне Breakpoint Settings, либо повесить Breakpoint через контекстное меню, выбрав ранее выполненный запрос.
Перед выполнением запроса он будет остановлен и вы сможете отредактировать его тело, метод, протокол, url, параметры, заголовки и куки.
Когда запрос будет отправлен, ответ так же будет перехвачен, его аналогичным способом можно отредактировать.
Погружение в удивительный мир Charles для чайников
В сегодняшней статье я вам поведаю о том, как пользоваться программой Charles, мощным инструментом для тестирования веб-сервисов, в перечень возможностей которого входит перехватывание запросов, их подмена и перенаправление на локальные файлы.
Charles работает и на мобильных устройствах, но в этой статье мы будем рассматривать только версию для Windows. Давайте же начнем!
Repeat Advanced
Данная функция будет полезна для нагрузочного тестирования. Хоть Charles и не блещет особым потенциалом в данной области, но базовую проверку корректности флуд-контроля вы сможете выполнить.
Ниже подробно показано, как это сделать.
ПКМ по запросу -> Repeat Advanced.
Здесь настраиваем все в соответствии с указаниями на приложенной выше картинке.
Должно открыться новое окно, где отправляются запросы.
5. Focus
Focus — эта функция перемещает домен на первые позиции в списке.
Другие полезные функции
Инструмент Block Cookies – предотвращает получение клиентом запросов на установку cookie с сервера.
Инструмент No Caching предотвращает кэширование через заголовки.
MacOS Proxy или Windows Proxy разрешает или запрещает проксирование трафика из браузера, установленного на том же компьютере, что и Charles.
Инструмент Port Forwarding (проброс портов) позволяет пересылать запросы с одного порта на другой.
DNS Spoofing – перенаправляет запрос с доменного имени на указанный IP-адрес.
Mirror – автоматически сохраняет в указанную папку все ответы, возвращаемые в Charles. Затем их можно использовать как моки.
Как замокать ручку или подменить файл
Задача: подменить ответ от сервера на заранее подготовленный, сохраненный локально, например, чтобы замокать ответ ручки или заменить скрипт.
Для этих целей можно использовать инструмент Map Local (Tools – Map Local).
В настройках укажите ручку или файл на сервере, а также локальный файл, который будет использован вместо них. Поддерживаются форматы HTML, CSS, JSON, XML и медиафайлы.
Настройка программы
После установки программу следует настроить. Многие пользователи Charles забывают об этом этапе, а затем кусают локти, пытаясь понять, почему у них ничего не работает. На самом деле настройка программы очень простая, сейчас все покажу!
Для начала нужно установить сертификат программы. Именно из-за него, увы, и возникает большинство проблем, связанных с неработоспособностью программы.
Инструкция по установке сертификата:
Открываем меню установки сертификата через Help -> SSL Proxying -> Install Root Charles Certificate.
Жмем «Установить сертификат».
Здесь выбираем «Локальный компьютер» и жмем «Далее».
ВАЖНО! На этом этапе выбираем «Поместить все сертификаты в следующее хранилище», жмем «Обзор», затем ОБЯЗАТЕЛЬНО выбираем «Доверенные корневые центры сертификации».
Жмем «Далее».
Установку сертификата мы выполнили, теперь нам необходимо включить SSL Proxying и настроить его фильтрацию, чтобы начать перехватывать запросы. Фильтрация определяет, какие именно запросы нужно ловить, но мы сделаем так, чтобы у нас перехватывались все запросы.
Открываем Proxy -> SSL Proxying Settings.
Ставим галочку на «Enable SSL Proxying», затем под полем «Include» жмем на кнопку «Add».
Для отключения фильтрации и сниффинга всего трафика мы просто добавляем звездочку в поле « Host » .
Программа настроена. Теперь рассмотрим ее возможности и функции.
Установка Charles
Начать следует, конечно же, с установки. Скачиваем программу с официального сайта разработчика.
Программа платная, но есть тестовый период на 30 дней. Даже без покупки программой можно спокойно пользоваться, но время одной сессии будет ограничено 30 минутами, а также частенько на 5-10 секунд будет появляться оверлей.
Вы можете получить полную версию программы сами-знаете-какими методами, но мы их рассматривать не будем. Все же лучше поддержать разработчиков!
После скачивания следует запустить exe-файл и произвести инсталляцию. Здесь ничего сложного нет, просто оставьте стандартные настройки установки.
Функциональность Charles Proxy
- 1.1 Breakpoint
- 1.2 Rewrite
- 1.3 Map Local
- Proxy:
- 2.1 Throttle Settings
- 2.2 Reverse Proxies
- 2.3 Port Forwarding
- 2.4 MacOS Proxy/Windows Proxy
- 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
Как эмулировать проблемы в сети
Задача: посмотреть, как работает сервис в различных сетевых условиях.
Для этого предназначен инструмент Throttle (Proxy – Throttle Settings).
Здесь можно включить сетевые ограничения для определенных или всех хостов, а так же задать различные сетевые параметры.
- Bandwidth – пропускная способность;
- Utilisation – эффективность использования пропускной способности;
- Latency – задержка в миллисекундах между клиентом и сервером;
- MTU – максимальный объём данных за одну итерацию;
- Reliability – вероятность, что соединение не удастся;
- Stability – вероятность, что соединение будет нестабильным.
Так же можно использовать готовые предустановки из списка.
6. Repeat
Repeat — отправляет на сервер запрос, идентичный выбранному.
Как приручить Charles Proxy?
Привет! Многие из тех, кто приходит к нам на собеседование на должность тестировщика, с гордостью заверяют, что они могут пользоваться Charles Proxy. Но когда погружаешься в техническую часть, то становится очевидно, что кандидат только слышал об этом инструменте. Давайте уже наконец скорее приручим эту вазу!
Википедия нам сообщает, что:
Небольшое пояснение
Сниффинг — процесс мониторинга и перехвата всех пакетов, проходящих через сеть, с помощью инструментов сниффинга (Charles Proxy).
Первые шаги
1. Установка и запуск
Для начала необходимо загрузить и установить приложение.
Если у вас не приобретена лицензия, то будет доступна 30-ти дневная пробная версия с ограничениями (функциональность не блокируется, но будут появляться окна с таймаутом 5-10 секунд до возобновления использования, а также через 30 минут будет завершаться работа приложения).
2. Начинаем сниффить трафик
Запустите Charles Proxy на MAC, зайдите в меню Help -> SSL Proxying -> Install Charles Root Certificate -> Установить сертификат -> Импортируем сертификат.
Запустите Charles Proxy на Windows, зайдите в меню Help -> SSL Proxying -> Install Charles Root Certificate
В Windows, в открывшемся окне Сертификат -> Установить сертификат. Выбрать «Текущий пользователь» или «Локальный пользователь». Далее вы получите уведомление от мастера импорта сертификатов, что сертификат успешно импортирован.
3. Проксирование трафика веб-браузера
Рассмотрим вариант с проксированием на примере браузера Mozilla Firefox. И установку сертификата на примере двух OS: MAC и Windows.
3.1 Windows
Для этого узнаем IP-адрес ПК: в Charles Proxy перейдем в Help -> Local 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 перейдем в Help -> Local 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 и настроить домены, пакеты которых мы хотим перехватывать. А хотим мы получать запросы со всех сайтов. Для этого перейдите в раздел Proxy -> SSL Proxying Settings.
В открывшемся диалоговом окне поставьте галочку Enable SSL Proxying, выберите раздел Include и нажмите Add.
Далее заполните поле Host значением * (как показано на скриншоте) и нажмите ОК.
В диалоговом окне «SSL Proxying Settings» нажмите ОК.
Если необходим будет определенный host, следует указать например нужный *youla* (это значит, что будет расшифровываться трафик только тот, где в запросах есть youla.
4. Настройка прокси на Android
Чтобы отображались запросы приложения Android, у вас должна стоять соответствующая сборка Android-приложения, c установленным в манифесте разрешением. Давайте представим, что такое приложение имеется, и мы хотим начать получать его трафик. Важно: устройство Android и десктоп должны быть в одной сети.
Для этого узнаем IP-адрес ПК: в Charles Proxy перейдем в Help -> Local IP Address. Видим, что ваш IP: 192.168.1.50 .
Далее возьмите в руки телефон, откройте Свойства сети -> Название сети WiFi -> Прокси-сервер -> Вручную -> Имя хоста: *ваш IP* / Порт: *8888* -> Сохраните измененные свойства сети.
5. Настройка прокси на iOS
Возьмите в руки iPhone, откройте Свойства сети -> Название сети WiFi -> Прокси-сервер -> Вручную -> Имя хоста: *Наш IP* / Порт: *8888* -> Сохраните измененные свойства сети (важно: устройство iOS и десктоп должны быть в одной сети).
4. Recording Settings
Recording Settings — настройки отображения списков разрешенных и запрещенных доменов.
Во вкладке «Options» можно настроить лимит, то есть количество запросов, которое Charles Proxy может записать.
Во вкладке «Include» можно выбрать конкретный домен для отображения пакетов.
Во вкладке «Exclude» можем выбрать те домены, которые необходимо спрятать при сниффинге.
Устранение проблем
Большая часть функций Charles не будет работать если не установлены или не корректно установлены сертификаты. Это самая распространенная проблема. Вторая проблема может быть в том, что для связи клиента и сервера используется SSL соединение, но оно выключено в Charles, соответсвенно он не может его расшифровать, тем более изменить запрос или ответ.
Убедитесь, что ответ в Charles отображается в незашифрованном виде, как на скриншоте ниже. Это значит базовые настройки выполнены верно, сертификаты установлены, SSL Proxying включен.
Если же в ответе нечитаемый текст, как на скриншоте ниже, часть инструментов Charles работать не будет.
В этом случае проверьте, что выполнили все рекомендации по настройке описанные в начале данной статьи.
В частности удостоверьтесь, что проксирование включено для SSL соединений. Галочка в Enable SSL Proxying в Proxy – SSL Proxying Settings должна быть установлена, указана локация.
Сертификаты Charles должны быть установлены в системе (Help – SSL Proxying – Install Charles Root Certificate).
Сертификаты Charles должны быть установлены на клиенте, если в качестве него выступает другое устройство.
Если клиентом является iPhone, убедитесь, что кроме того, что сертификат установлен, ему так же выдано доверие (это один из пунктов, который часто пропускают).
Дополнительную информацию про установку сертификатов можно получить в документации Charles.
Если клиентом является браузер, установленный на том же компьютере, где и Charles убедитесь, что разрешено проксирование с локального устройства (Proxy – MacOS Proxy или Windows Proxy).
Делитесь интересными кейсами использования Charles и я добавлю их в статью.
Полезные ссылки
На этом всё. Но вы можете поддержать проект. Даже небольшая сумма поможет нам писать больше полезных статей.
Если статья помогла или понравилась, пожалуйста поделитесь ей в соцсетях.
Как подменить код ответа сервера
Задача: проверить как поведет себя клиент при неожиданном коде ответа от сервера.
Как и в предыдущих двух примерах, тут подойдет инструмент Rewrite (Tools – Rewrite).
Как подменить хост в API
Задача: подменить продовый хост с API на тестовый. Это можно сделать двумя способами.
Первый, через инструмент Rewrite, подобно тому, как описано в предыдущем разделе.
Второй способ подменить API, заключается в использовании инструмента Map Remote (Tools – Map Remote).
В зависимости от задачи можно подменить хост целиком, его часть или только параметры.
Compose
Нам достаточно выбрать один конкретный запрос и с помощью функции Compose поменять его параметры (заголовок запроса, тело запроса, куки, код и пр.)
Для начала мы можем отделить конкретные запросы от остальных с помощью функции Focus :
Теперь выбираем нужный нам запрос и выполняем ПКМ -> Compose
Например, можно подменять некоторые значения в коде, чтобы проверить валидацию на бэкенде. Допустим, поле принимает только числовое значение. Мы используем Compose, передавая в значение поле уже буквы. Если запрос пройдет без ошибок, то это значит, что валидация отсутствует.
После изменения нужных нам параметров жмем « Execute » и получаем копию запроса с ответом от сервера.
4. Recording Settings
Recording Settings — настройки отображения списков разрешенных и запрещенных доменов.
Во вкладке «Options» можно настроить лимит, то есть количество запросов, которое Charles Proxy может записать.
Во вкладке «Include» можно выбрать конкретный домен для отображения пакетов.
Во вкладке «Exclude» можем выбрать те домены, которые необходимо спрятать при сниффинге.
Как эмулировать недоступность сервера
Задача: проверить как поведет себя клиент при недоступности хоста.
Используя инструмент Block List (Tools – Block List), можно заблокировать доступ клиента к указанному хосту. На выбор разрыв соединения либо 403 код ответа.
Инструмент Allow List (Tools – Allow List) наоборот блокирует все хосты кроме разрешенных.
Breakpoint
Данная функция позволяет точнее работать с запросами, вешая на них так называемый «Breakpoint» (точку остановки).
Ниже показано, как через настройки добавить запрос в список Breakpoint. После повторного получения указанного вами запроса в программе откроется отдельная сессия, в которой вы сможете спокойно работать с ним.
Отмечу, что эта функция, по сути, делает автоматический Compose. Вы так же можете менять значения, но вам не придется каждый раз выбирать конкретный запрос.
Открываем Proxy -> Breakpoint Settings.
Ставим галочку на «Enable Breakpoints», затем жмем «Add».
Заполняем все поля в открывшемся окне (выше пример заполнения).
При повторном получении запроса с такими же данными у вас будет открываться новое окошко, в котором вы сможете работать с пойманным запросом. Удобно!
5. Focus
Focus — эта функция перемещает домен на первые позиции в списке.
Первые шаги
1. Установка и запуск
Для начала необходимо загрузить и установить приложение.
Если у вас не приобретена лицензия, то будет доступна 30-ти дневная пробная версия с ограничениями (функциональность не блокируется, но будут появляться окна с таймаутом 5-10 секунд до возобновления использования, а также через 30 минут будет завершаться работа приложения).
2. Начинаем сниффить трафик
Запустите Charles Proxy, зайдите в меню Help -> SSL Proxying -> Install Charles Root Certificate (см.1) -> Установить сертификат -> Импортируем сертификат.
Теперь у вас отображаются запросы, однако они зашифрованы, и кроме иероглифов ничего не видно. Чтобы видеть Request/Response в нормальном виде, нужно включить SSL Proxying и настроить домены, пакеты которых мы хотим перехватывать. А хотим мы получать запросы со всех сайтов. Для этого перейдите в раздел Proxy -> SSL Proxying Settings.
В открывшемся диалоговом окне поставьте галочку Enable SSL Proxying, выберите раздел Enclude и нажмите Add.
Далее заполните поле Host значением * (как показано на скриншоте) и нажмите ОК.
В диалоговом окне «SSL Proxying Settings» нажмите ОК.
Теперь можно смотреть запросы, отправляемые на сервер, и ответы сервера.
3. Проксирование трафика веб-браузера
При перезапуске Charles достаточно активировать Windows Proxy (если у вас ОС Windows) или Mac Proxy.
4. Настройка прокси на Android
Чтобы отображались запросы приложения Android, у вас должна стоять соответствующая сборка Android-приложения, c установленным в манифесте разрешением. Давайте представим, что такое приложение имеется, и мы хотим начать получать его трафик.
Для этого узнаем IP-адрес ПК: в Charles Proxy перейдем в Help -> Local IP Address. Видим, что ваш IP: 192.168.1.50 .
Далее возьмите в руки телефон, откройте Свойства сети -> Название сети WiFi -> Прокси-сервер -> Вручную -> Имя хоста: *ваш IP* / Порт: *8888* -> Сохраните измененные свойства сети.
5. Настройка прокси на iOS
Возьмите в руки iPhone, откройте Свойства сети -> Название сети WiFi -> Прокси-сервер -> Вручную -> Имя хоста: *Наш IP* / Порт: *8888* -> Сохраните измененные свойства сети.
1. Подмена данных
Представим, что нам надо протестировать на клиенте верстку. Нужно проверить, как будет отображаться большое количество бонусов у пользователя. Один из вариантов, который многие предложат: изменить в БД количество бонусов и проверить на клиенте. Да, вы будете правы! Однако на сервере может быть кэш, и необходимо подождать какое-то время, пока количество бонусов не обновится, либо просто подключиться к самой базе и выполнить запрос — это занимает определенное время. Есть вариант проще: изменить ответ от сервера! В Charles Proxy есть три способа подмены данных:
1.1 Breakpoint
У нас имеется приложение и профиль пользователя, у которого сейчас 45 бонусов на счету:
Чтобы «повесить» Breakpoint на запрос, перейдите в раздел Proxy -> Breakpoint Settings. Далее поставьте галочку Enable Breakpoints -> Add, и в открывшемся диалоговом окне «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 изменить количество бонусов нашего пользователя. Для этого откройте Tools -> Rewrite -> галочка «Enable Rewrite« -> Add. В поле Name можно ввести любое название подмены, например, «Change bonus», либо оставить по умолчанию «Untitled Set».
Следующим шагом необходимо добавить в «Location» путь запроса. Для этого, в разделе Location -> Add заполните следующие поля и сохраните:
Path: /api/v1/user/5e6222bbbedcc5975d2375f8
После того, как вы добавили путь запроса, необходимо изменить сам параметр и его значение. Для этого нужно создать Rewrite Rule:
Type: Body (потому что параметр находится в теле);
Раздел Match: в «Value» укажите значение и параметр, который возвращает сервер;
Раздел Replace: в «Value» укажите значение и параметр, который вы хотите увидеть на клиенте.
Далее сохраните «Rewrite Rule» и нажмите ОК на вкладке «Rewrite Settings». На клиенте перезапросите еще раз профиль пользователя. У вас автоматически подменилось количество бонусов пользователя. Мы снова богаты!
1.3 Map Local
Map Local — инструмент, который позволяет использовать локальные файлы, словно они являются частью сервера.
Перейдите в Tools -> Map Local.
Сохраните введенные значения на вкладке «Edit Mapping» и на вкладке «Map Local Settings».
На клиенте перезапросите еще раз профиль пользователя. У вас автоматически подменилось количество бонусов пользователя. Мы снова богаты!
Давайте рассмотрим другие возможности инструмента Charles Proxy. И начнем с самого начала, с вкладки «Proxy».
2.1 Throttle Settings
Throttle Settings — функция, позволяющая задавать разные параметры скорости соединения с выбранным доменом.
Функция для тех, кто любит тестировать в лифте, в метро, в подземном переходе. Перейдем в Proxy -> Throttle 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
3.2 Block Cookies
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
DNS Spoofing — перенаправляет доменное имя на определенный IP-адрес.
3.6 Mirror
Mirror — эта функция позволяет автоматически сохранять все ответы, возвращаемые в Charles Proxy. Они раскладываются локально в такой же иерархии, как на сервере. Если внезапно случился даунтайм на бэкенде, отвалилась тестовая среда и т. д., у вас уже есть готовые моки для Map Local. Активировать функцию можно так: Tools -> Mirror или Tools -> Auto Save.
3.7 Compose
Compose — функция редактирования запросов, которые вы поймали.
Как смотреть трафик
Запустите Charles. На устройстве или в браузере откройте интересующий сайт или приложение. При выполнении действий на клиенте, запросы с него и ответы от сервера будут логироваться в Charles.
В режиме Structure в левой части окна отображается список запросов, сгруппированный по хостам. Выделив элемент хоста, в правой части окна будет выведена подробная информация о запросе (сверху) и ответе (снизу), в том числе метод, заголовки, куки, запрос, ответ, параметры и прочая информация.
В режиме Sequence запросы отображаются без группировки, последовательно.
Чтобы исключить из отображения ненужные хосты, удобно пользоваться фильтром (поле под списком хостов).
Выделив хост, в контекстном меню можно включить режим Focus, при котором запросы к интересующим хостам будут группироваться вместе, а остальные скрыты в отдельную группу.
Не забывайте пользоваться Поиском (Edit – Find или Cmd+F). Он поможет быстро найти интересующий параметр или подстроку среди перехваченных запросов.
На что стоит обращать внимание:
- запрос уходит на верный URL;
- допустимое время между действием, отправкой запроса и получением ответа;
- метод, код ответа, тело, параметры cоответствуют ожидаемым, значения не пустые;
- формат данных;
- запрос не дублируется;
- данные отобразились на клиенте.
Как использовать Charles
Документацию можно почитать на официальном сайте , а в данной заметке я покажу основные кейсы его использования.
Читайте также: