Charles Proxy

Что такое Charles Proxy?

Charles Proxy - это HTTP прокси / HTTP монитор / Reverse Proxy, который позволяет тестировщику просматривать весь HTTP и SSL/HTTPS трафик между компьютером и интернетом. Это незаменимый инструмент для:

  • Анализа API запросов и ответов
  • Отладки проблем с сетевыми запросами
  • Тестирования различных сценариев путем модификации запросов
  • Имитации медленного соединения или сетевых ошибок
  • Тестирования мобильных приложений

Установка и первоначальная настройка

Установка Charles

  1. Скачайте Charles с официального сайта: https://www.charlesproxy.com/
  2. Установите программу (30-дневная пробная версия)
  3. Запустите Charles

Базовая настройка

  1. Включите запись трафика: Proxy → Start Recording (Cmd/Ctrl+R)
  2. Настройте браузер: Charles автоматически настроит системный прокси
  3. Проверьте работу: Откройте любой сайт и убедитесь, что трафик отображается

Настройка HTTPS

Для просмотра HTTPS трафика:

  1. Help → SSL Proxying → Install Charles Root Certificate
  2. Добавьте сайты для SSL Proxying:
    • Proxy → SSL Proxying Settings
    • Add: Host: *, Port: 443
  3. В браузере доверьте сертификату Charles

Основной интерфейс

Structure View (Структурированный вид)

  • Показывает запросы сгруппированные по доменам
  • Удобен для анализа конкретных сайтов
  • Иерархическая структура URL

Sequence View (Последовательный вид)

  • Показывает все запросы в хронологическом порядке
  • Удобен для анализа временной последовательности
  • Показывает timing каждого запроса

Основные панели

  • Request - детали исходящего запроса
  • Response - детали входящего ответа
  • Summary - краткая информация о запросе
  • Chart - временная диаграмма запроса

Анализ HTTP запросов

Просмотр деталей запроса

Request (Запрос):

GET /api/v1/users/123 HTTP/1.1
Host: api.example.com
Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...
Content-Type: application/json
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64)

Response (Ответ):

HTTP/1.1 200 OK
Content-Type: application/json
Content-Length: 245

{
  "id": 123,
  "name": "John Doe",
  "email": "john@example.com",
  "status": "active"
}

Анализ производительности

Timing информация:

  • DNS Lookup - время поиска IP адреса
  • Connect - время установки соединения
  • SSL Handshake - время SSL рукопожатия
  • Request - время отправки запроса
  • Response - время получения ответа

Поиск медленных запросов:

  1. Сортируйте по столбцу "Duration"
  2. Ищите запросы с временем > 1-2 секунд
  3. Анализируйте bottlenecks в timing диаграмме

Модификация запросов и ответов

Breakpoints (Точки останова)

Настройка Breakpoint:

  1. Выберите запрос
  2. Proxy → Breakpoint Settings
  3. Добавьте URL или используйте правый клик → "Breakpoints"

Типы Breakpoints:

  • Request - остановка перед отправкой запроса
  • Response - остановка перед получением ответа

Модификация в реальном времени:

Исходный запрос:
POST /api/login
{"username": "test", "password": "123"}

Модифицированный запрос:
POST /api/login  
{"username": "admin", "password": "admin123"}

Map Remote (Перенаправление)

Использование: Перенаправление запросов с одного сервера на другой

Настройка:

  1. Tools → Map Remote
  2. Add Mapping:
    • From: https://api.prod.com/api/v1/
    • To: https://api.test.com/api/v1/

Применение:

  • Тестирование с разными средами
  • Использование mock серверов
  • Отладка с локальными сервисами

Map Local (Локальная замена)

Использование: Замена ответов сервера локальными файлами

Настройка:

  1. Tools → Map Local
  2. Add Mapping:
    • URL: https://api.example.com/api/users
    • Local Path: /path/to/mock-users.json

Файл mock-users.json:

{
  "users": [
    {"id": 1, "name": "Test User 1"},
    {"id": 2, "name": "Test User 2"}
  ]
}

Rewrite (Переписывание)

Автоматическая модификация:

  1. Tools → Rewrite
  2. Add Set и настройте правила

Примеры правил:

  • Добавление заголовков
  • Изменение URL параметров
  • Модификация тела запроса/ответа

Имитация сетевых условий

Throttling (Ограничение скорости)

Настройка:

  1. Proxy → Throttle Settings
  2. Выберите предустановленные настройки или создайте свои

Предустановки:

  • 56k Modem - 56 kbit/s
  • 3G - 1.6 Mbps down, 768 kbps up
  • 4G - 12 Mbps down, 5 Mbps up

Применение:

  • Тестирование на медленных соединениях
  • Проверка поведения при загрузке
  • Оптимизация производительности

No Caching (Отключение кэша)

Настройка: Proxy → Proxy Settings → Web Interface Включите "No Caching"

Результат:

  • Браузер не будет использовать кэшированные ресурсы
  • Все запросы будут выполняться заново
  • Полезно для тестирования обновлений

Тестирование мобильных приложений

Настройка для iOS/Android

Настройка Charles:

  1. Help → Local IP Address - запомните IP адрес
  2. Proxy → Proxy Settings - убедитесь что порт 8888 включен

Настройка мобильного устройства:

  1. Подключите устройство к той же Wi-Fi сети
  2. Настройки Wi-Fi → Прокси → Ручной:
    • Сервер: IP адрес Charles
    • Порт: 8888

Для HTTPS на мобильных:

  1. На устройстве откройте http://chls.pro/ssl
  2. Установите сертификат Charles
  3. iOS: Настройки → Основные → Об этом устройстве → Доверие к сертификатам
  4. Android: Настройки → Безопасность → Доверенные учетные данные

Анализ мобильного трафика

Фильтрация запросов:

Filter: *.myapp.com
Показывает только запросы к серверам приложения

Поиск проблем:

  • Ошибки 4xx/5xx в API запросах
  • Медленные запросы (> 5 секунд)
  • Большие размеры ответов
  • Неэффективные запросы (множественные вызовы)

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

1. Тестирование API авторизации

Сценарий: Проверить, как приложение обрабатывает различные ответы сервера авторизации

Шаги:

  1. Настройте Breakpoint на /api/auth/login
  2. Выполните вход в приложение
  3. Измените ответ сервера:
Оригинал:
{"success": true, "token": "abc123"}

Тест 1 - Ошибка сервера:
{"success": false, "error": "Invalid credentials"}

Тест 2 - Медленный ответ:
Добавьте задержку в 10 секунд

2. Тестирование обработки ошибок

Map Local для имитации ошибок:

500_error.json:
{
  "error": "Internal Server Error",
  "message": "Database connection failed"
}

404_error.json:
{
  "error": "Not Found",
  "message": "User not found"
}

Применение:

  1. Настройте Map Local для API endpoints
  2. Проверьте как приложение отображает ошибки
  3. Убедитесь в корректной обработке каждого статус-кода

3. Тестирование загрузки файлов

Throttling для медленной загрузки:

  1. Настройте очень медленное соединение (56k)
  2. Попробуйте загрузить большой файл
  3. Проверьте:
    • Показывается ли прогресс загрузки
    • Можно ли отменить загрузку
    • Как обрабатываются таймауты

4. Тестирование кэширования

Проверка HTTP кэширования:

  1. Выполните запрос к API
  2. Проверьте заголовки кэширования:
Cache-Control: max-age=3600
ETag: "abc123"
Last-Modified: Wed, 15 Jan 2024 14:30:00 GMT
  1. Повторите запрос и проверьте использование кэша
  2. Используйте No Caching для принудительного обновления

Расширенные возможности

Composer (Создание запросов)

Создание тестовых запросов:

  1. Tools → Composer
  2. Настройте запрос:
Method: POST
URL: https://api.example.com/users
Headers:
  Content-Type: application/json
  Authorization: Bearer token123

Body:
{
  "name": "Test User",
  "email": "test@example.com"
}
  1. Нажмите "Execute" для отправки

Repeat (Повторение запросов)

Нагрузочное тестирование:

  1. Выберите запрос
  2. Tools → Repeat
  3. Настройте количество повторений
  4. Анализируйте производительность при нагрузке

Charts (Графики)

Анализ производительности во времени:

  • View → Show Chart
  • Показывает время ответа для каждого запроса
  • Помогает выявить паттерны производительности

Интеграция с тестированием

Автоматизация с Charles

Экспорт в curl:

# Charles может экспортировать запросы в curl команды
curl -X POST "https://api.example.com/login" \
  -H "Content-Type: application/json" \
  -d '{"username":"test","password":"123"}'

Экспорт сессий:

  • File → Export Session
  • Сохранение в различных форматах (HAR, CSV, XML)

Collaboration (Совместная работа)

Sharing sessions:

  1. File → Save Session
  2. Отправьте .chls файл коллегам
  3. Они могут открыть и проанализировать тот же трафик

Полезные горячие клавиши

Cmd/Ctrl + R     - Start/Stop Recording
Cmd/Ctrl + K     - Clear Session
Cmd/Ctrl + F     - Find
Cmd/Ctrl + G     - Find Next
Space            - Quick Look preview
Delete           - Remove selected requests
Cmd/Ctrl + D     - Duplicate request

Советы и лучшие практики

Организация тестирования

  1. Используйте фильтры для конкретных доменов
  2. Сохраняйте сессии для каждого тест-кейса
  3. Документируйте найденные проблемы со скриншотами Charles
  4. Создавайте шаблоны запросов в Composer для повторного использования

Безопасность

  1. Отключайте Charles когда не тестируете
  2. Не оставляйте прокси включенным постоянно
  3. Будьте осторожны с сертификатами на рабочих устройствах
  4. Не перехватывайте трафик других пользователей

Производительность

  1. Очищайте сессии регулярно (Cmd/Ctrl + K)
  2. Используйте фильтры для уменьшения объема данных
  3. Настройте включение/исключение доменов в Proxy Settings

Заключение

Charles Proxy - мощный инструмент для тестирования сетевого взаимодействия. Он позволяет:

  • Глубоко анализировать API трафик
  • Имитировать различные сетевые условия
  • Тестировать обработку ошибок
  • Отлаживать мобильные приложения
  • Проводить нагрузочное тестирование

Освоение Charles значительно расширит ваши возможности как тестировщика, особенно при работе с веб и мобильными приложениями.