Browser & System Configuration
In order for any browser (or any application) to use Charles it must be configured to use Charles as its proxy server. Most browsers will have a way to configure this manually, but configuring manually is annoying because you have to configure and reconfigure everytime you start and stop Charles.
Fortunately Charles can autoconfigure the proxy settings in many cases including:
- Windows / Internet Explorer proxy settings – used automatically by most Windows applications
- macOS proxy settings – used automatically by most macOS applications
- Mozilla Firefox proxy settings (all platforms)
Windows Proxy Settings
Charles can automatically configure the Windows proxy settings so that Internet Explorer and other Windows applications automatically start using Charles. By default Charles will configure and then reconfigure the Windows proxy settings whenever Charles is started or quit.
Charles proxy configuration behaviour can be changed in Charles in the Proxy Menu, Proxy Settings dialog.
The Windows proxy settings are configured in the Internet Options control panel on the Connections tab if you want to look at them yourself.
Microsoft Edge has an additional setting that you may need to make by browsing to about:flags and enabling Allow localhost loopback. This is required in order to connect to Charles Proxy running on localhost.
macOS Proxy Settings
Charles can automatically configure the macOS system proxy settings so that Safari and other macOS applications automatically start using Charles.
When you first install Charles you will be prompted to grant permissions to Charles to autoconfigure the proxy settings. After that, Charles will configure and then reconfigure the macOS proxy settings whenever Charles is started or quit.
Charles proxy configuration behaviour can be changed in Charles in the Proxy Menu, Proxy Settings dialog.
The macOS proxy settings are configured in the advanced areas of the Network panel in the System Preferences if you want to look at them yourself.
In order to use HTTP 2 with Charles from Safari you must use Charles in SOCKS mode. See the Proxy Settings for configuring SOCKS.
iOS Device Settings
To use Charles as your HTTP proxy on your iPhone you must manually configure the HTTP Proxy settings on your WiFi network in your iPhone’s Settings.
Go to the Settings app, tap Wi-Fi, find the network you are connected to and then tap it to configure the network. Scroll down to the HTTP Proxy setting, tap Manual. Enter the IP address of your computer running Charles in the Server field, and the port Charles is running on in the Port field (usually 8888). Leave Authentication set to Off.
All of your web traffic from your iPhone will now be sent via Charles. You should see a prompt in Charles when you first make a connection from the iPhone, asking you to allow the traffic. Allow this connection. The IP address of your iPhone will be added to the Access Control list in Charles, which you can view and change in the Proxy menu > Access Control Settings.
Remember to disable the HTTP Proxy in your Settings when you stop using Charles, otherwise you’ll get confusing network failures in your applications!
Auto configuration
You can also supply an auto-configuration URL instead of entering manual configuration. This approach will enable your device to first try to use Charles, but then to fallback to using a direct connection if Charles isn’t running. This is an experimental approach!
For the auto-configuration URL enter:
https://chls.pro/X.X.X.X.pac
Where you replace X.X.X.X with the IP address of your computer running Charles. This defaults to port 8888. If you use a different port, just include that, e.g. https://chls.pro/X.X.X.X:XXXX.pac
You can also use Charles in SOCKS proxy mode from iOS using an autoconfiguration rule, in spite of this not being available as a manual setting. Enter the auto-configuration URL as follows:
https://chls.pro/X.X.X.X:XXXX.socks.pac
HTTP 2
Safari on iOS 10 does not currently support HTTP 2 via HTTP proxies. In order to use HTTP 2 with Safari on iOS and Charles Proxy you need to use Charles in SOCKS mode and use the auto-configuration URL described above to specify SOCKS mode.
iOS Simulators
The iOS Simulator should use the system proxy settings. If it doesn’t, please try quitting and restarting the iOS Simulator. As of Xcode 6 it appears to be important that Charles is running and set as the macOS system proxy before you run the iOS Simulator.
Mozilla Firefox Proxy Settings
Configure Firefox to use your system proxy settings. In Firefox, go to Preferences > Advanced > Network > Connection Mozilla Firefox can now be configured to use the system proxy settings, which is usually preferable as Charles can control the system proxy settings on Windows and macOS without the need for installing an add-on. Check your Firefox proxy settings in Preferences > Advanced > Network > Connection and press the Settings button. Then choose «Use system proxy settings».
Manual Proxy Configuration
In Charles, go to the Proxy menu and choose Proxy Settings. This will show you the currently configured HTTP Proxy Port and SOCKS Proxy Port. Note down which one you want to use (probably HTTP Proxy).
The host name is 127.0.0.1 (your own computer) or the external address of your computer if you want to access Charles from another computer.
You can then configure your browser or application’s proxy settings with that host name and port.
Java Application Proxy Configuration
You can configure your Java application to use Charles in code or as command line arguments to the java executable.
System.setProperty(«http.proxyHost», «127.0.0.1»);
System.setProperty(«http.proxyPort», «8888»);
And for HTTPS as well. Note that you may also want to configure Java to trust Charles’s root certificate in this case (see SSL Proxying).
System.setProperty(«https.proxyHost», «127.0.0.1»);
System.setProperty(«https.proxyPort», «8888»);
For the source of this information, including more discussion and how to set these as command line arguments: http://java.sun.com/j2se/1.5.0/docs/guide/net/proxies.html
See this tutorial on integrating Charles with your Java application by a Charles user. Or see this tutorial on integrating Charles with the Play framework.
cURL and libcurl
For cURL on the command line:
curl —proxy localhost:8888
If you are developing an application using libcurl you can configure it to use Charles as its proxy server:
curl_easy_setopt(pCurl, CURLOPT_PROXY, «127.0.0.1»);
curl_easy_setopt(pCurl, CURLOPT_PROXYPORT, 8888);
If you are using SSL you may like to disable the certificate verification during development, if you can’t get cURL to trust Charles’s CA certificate:
curl_easy_setopt(pCurl, CURLOPT_SSL_VERIFYPEER, 0);
Thanks to Michael Klische for providing this information.
Android emulator
In the Android emulator run configuration add an Additional Emulator Command Line Option:
-http-proxy http://10.0.2.2:8888
Where 10.0.2.2 is a special IP address for Android Emulators that resolves to the host computer IP. If you run Charles on another computer, replace that IP address with the IP address of the other computer.
Android
Some Android devices have HTTP proxy settings. On the Nexus S it is hidden; you can access the HTTP proxy settings by opening the Voice Dialler app and saying «proxy». On some Samsung devices you can access proxy settings by long-pressing on the network name in the WiFi configuration.
You can also hardcode your application to use a proxy server during testing:
HttpHost httpproxy = new HttpHost(«192.168.0.101», 8888, «http»);
httpClient.getParams().setParameter(ConnRoutePNames.DEFAULT_PROXY,httpproxy);
or
HttpUrlConnection conn = url.openConnection(new Proxy(Proxy.Type.HTTP, new InetSocketAddress(«192.168.0.101», 8888)));
Make sure the first IP address is the IP address of your computer running Charles, then add this code to customise your httpClient or to open a URL connection.
Время на прочтение
10 мин
Количество просмотров 262K
Привет! Многие из тех, кто приходит к нам на собеседование на должность тестировщика, с гордостью заверяют, что они могут пользоваться Charles Proxy. Но когда погружаешься в техническую часть, то становится очевидно, что кандидат только слышал об этом инструменте. Давайте уже наконец скорее приручим эту вазу!
Википедия нам сообщает, что:
Charles представляет собой кроссплатформенное приложение прокси-сервера для отладки HTTP, написанное на Java. Он позволяет пользователю просматривать HTTP, HTTPS и активированный трафик TCP-порта, доступ к которому осуществляется с локального компьютера, на него или через него. Сюда входят запросы и ответы, включая HTTP-заголовки и метаданные (например, файлы cookie, кэширование и кодирование информации), с функциями, предназначенными для помощи разработчикам и тестировщикам в анализе соединений и обмене сообщениями.
Небольшое пояснение
Сниффинг — процесс мониторинга и перехвата всех пакетов, проходящих через сеть, с помощью инструментов сниффинга (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* → Сохраните измененные свойства сети.
Теперь необходимо перейти по ссылке chls.pro/ssl или charlesproxy.com/getssl, а далее начнется автоматическая загрузка сертификата. Откройте его, задайте имя сертификата, и теперь у вас есть доступ к трафику Android-приложения.
5. Настройка прокси на iOS
Возьмите в руки iPhone, откройте Свойства сети → Название сети WiFi → Прокси-сервер → Вручную → Имя хоста: *Наш IP* / Порт: *8888* → Сохраните измененные свойства сети (важно: устройство iOS и десктоп должны быть в одной сети).
Теперь необходимо перейти по ссылке chls.pro/ssl или charlesproxy.com/getssl, «Разрешить» загрузку профиля конфигурации. Далее перейдите в Настройки → Профиль загружен → Установить. Затем перейдите в Настройки → Основные → Об этом устройстве → Доверие сертификатам → найдите установленный сертификат и сделайте его «Доверенным».
Функциональность 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
1. Подмена данных
Представим, что нам надо протестировать на клиенте верстку. Нужно проверить, как будет отображаться большое количество бонусов у пользователя. Один из вариантов, который многие предложат: изменить в БД количество бонусов и проверить на клиенте. Да, вы будете правы! Однако на сервере может быть кэш, и необходимо подождать какое-то время, пока количество бонусов не обновится, либо просто подключиться к самой базе и выполнить запрос — это занимает определенное время. Есть вариант проще: изменить ответ от сервера! В Charles Proxy есть три способа подмены данных:
1.1 Breakpoint
Breakpoint — это некая точка остановки запроса. Когда обнаруживается запрос из заданного списка, для дальнейшего ручного взаимодействия с параметрами запроса открывается отдельное окно. В нём перейдите к ручному изменению запросов и ответов. Удобно использовать эту функцию, когда тестируете API или разные ответы сервера.
У нас имеется приложение и профиль пользователя, у которого сейчас 45 бонусов на счету:
Запрос, в котором приходит это количество бонусов: https://api.youla.io/api/v1/user/5e6222bbbedcc5975d2375f8
Чтобы «повесить» 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 заполните следующие поля и сохраните:
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 — функция, позволяющая задавать разные параметры скорости соединения с выбранным доменом.
Функция для тех, кто любит тестировать в лифте, в метро, в подземном переходе. Перейдем в 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
Инструмент 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. Активировать функцию можно так: Tools → Mirror или Tools → Auto 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
This guide is for anyone who needs to inspect and/or modify HTTP requests to and from your PC. For example, if you need to inspect Adobe Analytics or Google Analytics tracking beacons.
See here for the Charles for macOS Guide
Use cases:
- QA/verify Adobe Analytics or Google Analytics tracking beacons
- Inspect and/or transform HTTP requests to and from your PC
- Throttle connection either to specific hosts or all hosts
- Local proxy for websites, apps, Universal Windows Platform (UWP), or Android Studio
- Set up Windows 10 to proxy for iOS, iPhone, iPad, Android, tvOS, and Apple TV
Charles Proxy is a powerful website optimization and QA tool for developers, analysts, and engineers. With Charles you can monitor exactly how your application communicates with a remote server.
Part 1 – Certificate Set Up
The first part of the guide will help you add the Charles SSL Certificate to your PC so that Charles can decrypt any local HTTPS traffic.
Step 0 – Download and install Charles
Step 1 – Open Charles then go to Help > SSL Proxying > Install Charles Root Certificate
Step 2 – Click “Install Certificate”
Step 3 – Select either “Current User” or “Local Machine”. I recommend “Current User” for most users.
Step 4 – Select “Place all certificates in the following store” then click “Browse”
Step 5 – Select “Trusted Root Certification Authorities” then click “OK“
Step 6 – Click “Next“
Step 7 – Click “Finish“
Step 8 – You should see a message saying “The import was successful”, click “OK“
Part 2 – SSL Proxying Set Up
This part will help you set up Charles so that it can decrypt HTTPS encrypted traffic.
Step 1 – Enable Windows Proxy if it is not enabled already. Click on Proxy > Windows Proxy. You should see a checkmark to indicate that the windows proxy is enabled.
Step 2 – Go to Proxy > SSL Proxying Settings
Step 3 – Click on the “Enable SSL Proxying” checkbox, then under “Include”, click “Add“.
Step 4 – Enter the host and port that you want to decrypt. See the table below for common host patterns used for analytics QA and validation. Then click “OK“, then click “OK” again to go back to the main Charles window.
Common Hosts Used in Analytics QA
Usage | Host | Port |
Adobe Analytics (3rd Party Cookies) | *.omtrdc.* | 443 |
Adobe Analytics (Common FPC CNAME Option) | smetrics.* | 443 |
Adobe DTM & Launch | *.adobedtm.* | 443 |
Google Analytics | *.google-analytics.* | 443 |
Google Tag Manager | *.googletagmanager.* | 443 |
Tealium IQ | *.tiqcdn.* | 443 |
Decrypt All HTTPS Requests | * | 443 |
Step 5 – Close Charles and Re-Open
Step 6 – Enter “google-analytics” as the Filter and on a new browser tab, go to https://analystadmin.com/, you should see the HTTPS analytics tracking beacon go out.
For users who only need to intercept HTTPS on your local machine (Ex: web browser), you can stop here.
Firewall Set Up for iPhone and Android Proxying
This part only applies to users who need to proxy traffic to your PC from an external device. For example, if you have an iPhone and need to capture a Charles log with your PC.
In some cases, Windows 10 PCs are set up with very strict firewall rules. Use this section to check if Charles is set up correctly with your firewall.
Step 1 – Press the Windows key and start typing “Windows Defender Firewall with Advanced Security“. Then open the application.
Step 2 – Under Inbound Rules, look for Charles Web Debugging Proxy.
-> Stop here if you see green next to both Charles rules.
-> Continue to Step 3 if you see a prohibited (blocked) sign next to any Charles rules
Step 3 – Double click on a blocked Charles rule, then click on “Allow the connection” and click “OK“. Repeat for the second rule if needed.
Step 4 – You should see a green circle with a checkmark next to the Charles rules now.
You’re done! Now you have a Windows 10 PC that can proxy local traffic as well as external traffic from phones and tablets.
While setting up the Charles on a windows machine, under the Proxy menu there should be option to enable Windows Proxy.
Was expecting a Windows Proxy option, something like this:
But I’m unable to see any option to enable the Windows Proxy on my system:
- charles-proxy
Robert
39.5k17 gold badges101 silver badges152 bronze badges
asked Aug 22 at 6:14
4
-
Do you use a company owned PC? If yes may be proxy settings is disabled by admins.
Aug 22 at 11:33
-
@Robert Yeah, I’m using company owned PC, but other people are using it.
Aug 23 at 6:01
-
You should manually check your Proxy settings in Windows Internet Options if you can enter a proxy there manually. If the fields are grayed-out you know why Charles can not register itself as Windows proxy.
Aug 23 at 6:52
-
I can see Automatically Detect settings toggle is On, although Manual Proxy setup is Off. In Fiddler the manual proxy options gets On automatically with all the required fields. However in Charles that is not the case, we have to toggle it On. If you can tell me what we have to enter in those Address and Port fields after switching on Manual Proxy.
Aug 25 at 5:56
Load 6 more related questions
Show fewer related questions
В сегодняшней статье я вам поведаю о том, как пользоваться программой Charles, мощным инструментом для тестирования веб-сервисов, в перечень возможностей которого входит перехватывание запросов, их подмена и перенаправление на локальные файлы.
Charles работает и на мобильных устройствах, но в этой статье мы будем рассматривать только версию для Windows. Давайте же начнем!
Установка Charles
Начать следует, конечно же, с установки. Скачиваем программу с официального сайта разработчика.
Программа платная, но есть тестовый период на 30 дней. Даже без покупки программой можно спокойно пользоваться, но время одной сессии будет ограничено 30 минутами, а также частенько на 5-10 секунд будет появляться оверлей.
Вы можете получить полную версию программы сами-знаете-какими методами, но мы их рассматривать не будем. Все же лучше поддержать разработчиков!
После скачивания следует запустить exe-файл и произвести инсталляцию. Здесь ничего сложного нет, просто оставьте стандартные настройки установки.
Комьюнити теперь в Телеграм
Подпишитесь и будьте в курсе последних IT-новостей
Подписаться
Настройка программы
После установки программу следует настроить. Многие пользователи Charles забывают об этом этапе, а затем кусают локти, пытаясь понять, почему у них ничего не работает. На самом деле настройка программы очень простая, сейчас все покажу!
Для начала нужно установить сертификат программы. Именно из-за него, увы, и возникает большинство проблем, связанных с неработоспособностью программы.
Инструкция по установке сертификата:
Открываем меню установки сертификата через Help -> SSL Proxying -> Install Root Charles Certificate.
Жмем «Установить сертификат».
Здесь выбираем «Локальный компьютер» и жмем «Далее».
ВАЖНО! На этом этапе выбираем «Поместить все сертификаты в следующее хранилище», жмем «Обзор», затем ОБЯЗАТЕЛЬНО выбираем «Доверенные корневые центры сертификации».
Жмем «Далее».
Затем жмем «Готово».
Установку сертификата мы выполнили, теперь нам необходимо включить SSL Proxying и настроить его фильтрацию, чтобы начать перехватывать запросы. Фильтрация определяет, какие именно запросы нужно ловить, но мы сделаем так, чтобы у нас перехватывались все запросы.
Открываем Proxy -> SSL Proxying Settings.
Ставим галочку на «Enable SSL Proxying», затем под полем «Include» жмем на кнопку «Add».
Для отключения фильтрации и сниффинга всего трафика мы просто добавляем звездочку в поле «Host».
Программа настроена. Теперь рассмотрим ее возможности и функции.
Compose
Данная функция позволяет нам отправить копию выбранного запроса с измененными параметрами.
Нам достаточно выбрать один конкретный запрос и с помощью функции Compose поменять его параметры (заголовок запроса, тело запроса, куки, код и пр.)
Для начала мы можем отделить конкретные запросы от остальных с помощью функции Focus:
Теперь выбираем нужный нам запрос и выполняем ПКМ -> Compose
У нас создается копия запроса, в которой мы можем менять все, что нам нужно: тело, шапку, тип запроса, версию HTTP и т.д.
Например, можно подменять некоторые значения в коде, чтобы проверить валидацию на бэкенде. Допустим, поле принимает только числовое значение. Мы используем Compose, передавая в значение поле уже буквы. Если запрос пройдет без ошибок, то это значит, что валидация отсутствует.
После изменения нужных нам параметров жмем «Execute» и получаем копию запроса с ответом от сервера.
Breakpoint
Данная функция позволяет точнее работать с запросами, вешая на них так называемый «Breakpoint» (точку остановки).
Ниже показано, как через настройки добавить запрос в список Breakpoint. После повторного получения указанного вами запроса в программе откроется отдельная сессия, в которой вы сможете спокойно работать с ним.
Отмечу, что эта функция, по сути, делает автоматический Compose. Вы так же можете менять значения, но вам не придется каждый раз выбирать конкретный запрос.
Открываем Proxy -> Breakpoint Settings.
Ставим галочку на «Enable Breakpoints», затем жмем «Add».
Заполняем все поля в открывшемся окне (выше пример заполнения).
При повторном получении запроса с такими же данными у вас будет открываться новое окошко, в котором вы сможете работать с пойманным запросом. Удобно!
Rewrite
Если же ваша задача заключается в подмене параметров множества запросов, то вы можете прибегнуть к функции «Rewrite».
Открываем Tools -> Rewrite.
Ставим галочку на «Enable Rewrite», затем в открывшемся окне под левым полем жмем «Add», а дальше жмем «Add» уже под правым верхним полем.
Заполняем все поля (они идентичны тем, что заполняются при создании Breakpoint).
Затем жмем «Add» уже под правым нижним полем, указываем тип редактирования запроса, заменяемые значения, а также условия замены.
Давайте поймаем запрос и посмотрим на реакцию Charles!
Charles поймал нужный запрос, а затем заменил все Header одним значением.
Repeat Advanced
Данная функция будет полезна для нагрузочного тестирования. Хоть Charles и не блещет особым потенциалом в данной области, но базовую проверку корректности флуд-контроля вы сможете выполнить.
Ниже подробно показано, как это сделать.
ПКМ по запросу -> Repeat Advanced.
Здесь настраиваем все в соответствии с указаниями на приложенной выше картинке.
Проверяем!
Должно открыться новое окно, где отправляются запросы.
Map Local
Последняя функция в сегодняшней статье. Позволяет работать с локальными файлами.
Демонстрация инструмента ниже.
ПКМ по запросу -> Map Local.
В открывшемся окне у нас идут знакомые поля. Жмем «Choose» и выбираем локальный файл, после чего жмем «OK».
При повторном получении того же запроса Charles будет перенаправлять его на локальный файл.
Надеюсь, эта статья помогла вам разобраться в основах Charles. Это действительно мощный и довольно простой инструмент для тестирования. Спасибо за внимание!