Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Ловля сетями
Вымышленная история одного разработчика
1
Дмитрий Рыбаков
Руководитель мобильной разработки, Lamoda
Об авторе
dmitriy.rybakov@lamoda.ru
http://tech.lamoda.ru
2
Предисловие
Предисловие
Почти любое мобильное приложение общается с сервером
Очень часто по HTTP + JSON/XML
4
Предисловие
Василий П. —
мобильный разработчик
Динамично
развивающийся стартап
Тестовое задание
https://developer.github.c...
До приложения
Браузер
Самое быстрое
решение всегда под
рукой
7
Браузер
Делаем красиво.
Плагины для Chrome
JSON Viewer
JSON Formatter
JSON Handle
и еще десятки…
8
curl
Любые действия с
URL в консоли
curl https://api.github.com/users/MikeCamino
9
curl
10
curl https://api.github.com/users/MikeCamino -i
Заголовки ответа
curl https://api.github.com/users/MikeCamino –i –...
API tools
11
Soap UI
Много функций
Поддержка SOAP
Интерфейс из 2000-х
Очень медленно
Insomnia
Как редактор кода
Лаконичный...
Postman
Комплекс для
тестирования API
Все платформы и
расширение для
Chrome
12
Postman
История, коллекции запросов и переменные
13
Postman
Параметры и заголовки запроса
14
Postman
Заголовки и форматирование ответа
15
Postman
OAuth 2
16
До приложения
17
Браузер
Всегда под рукой
Много плагинов
Только GET-запросы
CURL
Умеет почти все
Много ручного труда
Нет O...
В коде приложения
Отладчик
Есть в IDE «из
коробки»
19
Контекст запроса
Стек вызовов
Отладчик
Куда поставить точку остановки?
20
1 // Создаем HTTP-клиента
2 OkHttpClient client = new OkHttpClient.Builder()
3...
Отладчик
Куда поставить точку остановки? А вот куда
21
// Создаем HTTP-клиента
OkHttpClient client = new OkHttpClient.Buil...
Логирование запросов
Android + OkHttp 3 + Logging Interceptor. Подключение
22
compile 'com.squareup.okhttp3:logging-interc...
Логирование запросов
Android + OkHttp3 + LoggingInterceptor. Результат
23
D/OkHttp: --> GET https://api.github.com/users/M...
Логирование запросов
iOS + Response Detective. Подключение
24
let configuration = URLSessionConfiguration.default
Response...
Логирование запросов
iOS + Response Detective. Результат
25
<0x000000000badf00d> [REQUEST] GET https://api.github.com/user...
Внешние отладчики
26
Chrome
Developer Tools
Facebook
Stetho
Android
Square Pony
Debugger
iOS
http://facebook.github.io/ste...
Facebook Stetho (Android)
Подключение
27
debugCompile ("com.facebook.stetho:stetho:1.5.0")
debugCompile ("com.facebook.ste...
Square Pony Debugger (iOS)
Подключение
28
pod 'PonyDebugger', '~> 0.4.3'
ponyd serve --listen-interface=127.0.0.1
CocoaPod...
Stetho / Pony. Запросы
Список запросов
29
Последовательность
Размер и время
Таймлайн
Stetho / Pony
Форматирование
ответов:
JSON
XML
Картинки
30
Stetho / Pony
Иерархия View
31
Stetho / Pony
Просмотр данных
SQLite
CoreData
32
Во время разработки
33
Отладчик
Всегда под рукой
Все детали и контекст
Медленно и по одному
Логирование
Любые свои запросы...
Без кода приложения
Без кода приложения
Отладочные прокси
35
Устройство Прокси Сервер
Отладочные прокси
36
На устройстве
Packet Capture
Только Android
На локальной машине
Charles Proxy
Fiddler
Burp
В облаке
C...
Charles
Android
iOS
Реальные
устройства
Эмуляторы
37
Charles
Весь трафик
устройства
Картинки
Сторонние библиотеки
Шифрованный трафик
38
Отладочные прокси
Без дешифрования трафика
39
Устройство Прокси Сервер
Сертификат сервера Сертификат сервера
Отладочные прокси
Дешифрование трафика
40
Устройство Прокси Сервер
Сертификат прокси Сертификат прокси
Charles
Весь трафик
устройства
В том числе и HTTPS
41
Отладочные прокси
Владеют всем трафиком устройства
42
Устройство Прокси Сервер
Модификация запросов и
ответов
Троттлинг и ...
Без кода приложения
43
Charles
Все платформы
$50 за лицензию
Fiddler
Бесплатный
Только Windows
Cloud Middleman
Не требует ...
В заключение
В заключение
45
До приложения
Специальные
инструменты для
тестирования API
В коде приложения
Логирование запросов
Внешние ...
Спасибо!
Дмитрий Рыбаков Руководитель мобильной разработки, Lamoda
email dmitriy.rybakov@lamoda.ru
http://tech.lamoda.ru
Upcoming SlideShare
Loading in …5
×

Ловля сетями. Инструменты отладки сетевых запросов приложений / Дмитрий Рыбаков (Lamoda)

1,029 views

Published on

РИТ++ 2017, AppsConf
Зал Найроби + Касабланка, 5 июня, 11:00

Тезисы:
http://appsconf.ru/2017/abstracts/2584.html

Большинство современных мобильных приложений так или иначе работает с каким-то API (а зачастую и не с одним). Количество запросов при этом может достигать десятков в минуту и понимание того, что сейчас происходит в сетевом слое вашего приложения, становится непростой задачей.

Я расскажу и покажу весь диапазон современных средств для мониторинга и отладки сетевых запросов: от самых простых до узкоспециальных - с плюсами/минусами каждого из инструментов и областями их применения.

Published in: Engineering
  • Be the first to comment

  • Be the first to like this

Ловля сетями. Инструменты отладки сетевых запросов приложений / Дмитрий Рыбаков (Lamoda)

  1. 1. Ловля сетями Вымышленная история одного разработчика 1
  2. 2. Дмитрий Рыбаков Руководитель мобильной разработки, Lamoda Об авторе dmitriy.rybakov@lamoda.ru http://tech.lamoda.ru 2
  3. 3. Предисловие
  4. 4. Предисловие Почти любое мобильное приложение общается с сервером Очень часто по HTTP + JSON/XML 4
  5. 5. Предисловие Василий П. — мобильный разработчик Динамично развивающийся стартап Тестовое задание https://developer.github.com/v3/ 5
  6. 6. До приложения
  7. 7. Браузер Самое быстрое решение всегда под рукой 7
  8. 8. Браузер Делаем красиво. Плагины для Chrome JSON Viewer JSON Formatter JSON Handle и еще десятки… 8
  9. 9. curl Любые действия с URL в консоли curl https://api.github.com/users/MikeCamino 9
  10. 10. curl 10 curl https://api.github.com/users/MikeCamino -i Заголовки ответа curl https://api.github.com/users/MikeCamino –i –H ”User-Agent: GitHub Test App” Заголовки запроса curl https://api.github.com/gists –i –H ”User-Agent: GitHub Test App” –X POST Не только GET curl https://api.github.com/gists –i –H ”User-Agent: GitHub Test App” –X POST –d “{ "description": "the description for this gist", "public": true, "files": { "file1.txt": { "content": ”<6Kb of text>" } } }” POST-запрос с телом
  11. 11. API tools 11 Soap UI Много функций Поддержка SOAP Интерфейс из 2000-х Очень медленно Insomnia Как редактор кода Лаконичный интерфейс Меньше функций, чем у Postman Postman Все функции Insomnia Автоматизация тестирования API Перегруженный интерфейс https://insomnia.rest/https://www.soapui.org/ https://www.getpostman.com
  12. 12. Postman Комплекс для тестирования API Все платформы и расширение для Chrome 12
  13. 13. Postman История, коллекции запросов и переменные 13
  14. 14. Postman Параметры и заголовки запроса 14
  15. 15. Postman Заголовки и форматирование ответа 15
  16. 16. Postman OAuth 2 16
  17. 17. До приложения 17 Браузер Всегда под рукой Много плагинов Только GET-запросы CURL Умеет почти все Много ручного труда Нет OAuth API Tools Коллекции запросов Переменные и пресеты Форматирование ответов OAuth https://curl.haxx.se
  18. 18. В коде приложения
  19. 19. Отладчик Есть в IDE «из коробки» 19 Контекст запроса Стек вызовов
  20. 20. Отладчик Куда поставить точку остановки? 20 1 // Создаем HTTP-клиента 2 OkHttpClient client = new OkHttpClient.Builder() 3 .build(); 4 5 // Создаем запрос 6 Request rq = new Request.Builder() 7 .url("https://api.github.com/users/MikeCamino").build(); 8 9 // Выполняем его асинхронно 10 client.newCall(rq).enqueue(new Callback() { 11 public void onFailure(Call call, IOException e) {} 12 public void onResponse(Call call, Response response) throws IOException {} 13 }
  21. 21. Отладчик Куда поставить точку остановки? А вот куда 21 // Создаем HTTP-клиента OkHttpClient client = new OkHttpClient.Builder() .addInterceptor(new Interceptor() { public Response intercept(Chain chain) throws IOException { return chain.proceed(chain.request()); } }) .build(); // Создаем запрос Request rq = new Request.Builder() .url("https://api.github.com/users/MikeCamino").build(); // Выполняем его асинхронно client.newCall(rq).enqueue(new Callback() { public void onFailure(Call call, IOException e) {} public void onResponse(Call call, Response response) throws IOException {}
  22. 22. Логирование запросов Android + OkHttp 3 + Logging Interceptor. Подключение 22 compile 'com.squareup.okhttp3:logging-interceptor:3.8.0' HttpLoggingInterceptor logging = new HttpLoggingInterceptor(); logging.setLevel(Level.BODY); OkHttpClient client = new OkHttpClient.Builder() .addInterceptor(logging) .build(); build.gradle Java https://github.com/square/okhttp/tree/master/okhttp-logging-interceptor
  23. 23. Логирование запросов Android + OkHttp3 + LoggingInterceptor. Результат 23 D/OkHttp: --> GET https://api.github.com/users/MikeCamino http/1.1 D/OkHttp: --> END GET D/OkHttp: <-- 200 OK https://api.github.com/users/MikeCamino (1127ms) D/OkHttp: Server: GitHub.com D/OkHttp: Date: Thu, 01 Jun 2017 10:43:17 GMT D/OkHttp: Content-Type: application/json; charset=utf-8 D/OkHttp: Status: 200 OK D/OkHttp: Transfer-Encoding: chunked D/OkHttp: {"login":"MikeCamino","id":1525248,"avatar_url":"https://avatars0.githubusercontent. com/u/1525248?v=3","gravatar_id":"","url":"https://api.github.com/users/MikeCamino", "html_url":"https://github.com/MikeCamino","followers_url":"https://api.github.com/u sers/MikeCamino/followers","following_url":"https://api.github.com/users/MikeCamino/ following{/other_user}","gists_url":"https://api.github.com/users/MikeCamino/gists{/ gist_id}","starred_url":"https://api.github.com/users/MikeCamino/starred{/owner}{/re po}","subscriptions_url":"https://api.github.com/users/MikeCamino/subscriptions","or ganizations_url":"https://api.github.com/users/MikeCamino/orgs","repos_url":"https:/
  24. 24. Логирование запросов iOS + Response Detective. Подключение 24 let configuration = URLSessionConfiguration.default ResponseDetective.enable(inConfiguration: configuration) let session = URLSession(configuration: configuration) Общая конфигурация URLSession let manager = Alamofire.Manager(configuration: configuration) AlamoFire https://github.com/netguru/ResponseDetective
  25. 25. Логирование запросов iOS + Response Detective. Результат 25 <0x000000000badf00d> [REQUEST] GET https://api.github.com/users/MikeCamino ├─ Headers ├─ Body │ <none> <0x000000000badf00d> [RESPONSE] 200 (NO ERROR) https://api.github.com/users/MikeCamino ├─ Headers │ Server: GitHub.com │ Date: Thu, 01 Jan 1970 00:00:00 GMT │ Content-Type: application/json ├─ Body │ { │ "args" : { │ }, │ "headers" : { │ "User-Agent" : "ResponseDetective/1 CFNetwork/758.3.15 Darwin/15.4.0", │ "Accept-Encoding" : "gzip, deflate",
  26. 26. Внешние отладчики 26 Chrome Developer Tools Facebook Stetho Android Square Pony Debugger iOS http://facebook.github.io/stetho/ https://github.com/square/P onyDebugger
  27. 27. Facebook Stetho (Android) Подключение 27 debugCompile ("com.facebook.stetho:stetho:1.5.0") debugCompile ("com.facebook.stetho:stetho-okhttp3:1.5.0") public class MyApplication extends Application { public void onCreate() { super.onCreate(); Stetho.initializeWithDefaults(this); } } build.gradle Java
  28. 28. Square Pony Debugger (iOS) Подключение 28 pod 'PonyDebugger', '~> 0.4.3' ponyd serve --listen-interface=127.0.0.1 CocoaPods Start gateway server PDDebugger *debugger = [PDDebugger defaultInstance]; // Debugger singleton [debugger autoConnect]; [debugger enableNetworkTrafficDebugging]; Application code
  29. 29. Stetho / Pony. Запросы Список запросов 29 Последовательность Размер и время Таймлайн
  30. 30. Stetho / Pony Форматирование ответов: JSON XML Картинки 30
  31. 31. Stetho / Pony Иерархия View 31
  32. 32. Stetho / Pony Просмотр данных SQLite CoreData 32
  33. 33. Во время разработки 33 Отладчик Всегда под рукой Все детали и контекст Медленно и по одному Логирование Любые свои запросы Вместе с другими логами Только текстовые ответы Засоряет логи Stetho / Pony Все свои запросы Куча деталей Форматирование ответов Не только сеть Требуют настройки
  34. 34. Без кода приложения
  35. 35. Без кода приложения Отладочные прокси 35 Устройство Прокси Сервер
  36. 36. Отладочные прокси 36 На устройстве Packet Capture Только Android На локальной машине Charles Proxy Fiddler Burp В облаке Cloud Middleman
  37. 37. Charles Android iOS Реальные устройства Эмуляторы 37
  38. 38. Charles Весь трафик устройства Картинки Сторонние библиотеки Шифрованный трафик 38
  39. 39. Отладочные прокси Без дешифрования трафика 39 Устройство Прокси Сервер Сертификат сервера Сертификат сервера
  40. 40. Отладочные прокси Дешифрование трафика 40 Устройство Прокси Сервер Сертификат прокси Сертификат прокси
  41. 41. Charles Весь трафик устройства В том числе и HTTPS 41
  42. 42. Отладочные прокси Владеют всем трафиком устройства 42 Устройство Прокси Сервер Модификация запросов и ответов Троттлинг и точки останова Запись и реплеи
  43. 43. Без кода приложения 43 Charles Все платформы $50 за лицензию Fiddler Бесплатный Только Windows Cloud Middleman Не требует установки Доступен отовсюду Ограниченые возможности
  44. 44. В заключение
  45. 45. В заключение 45 До приложения Специальные инструменты для тестирования API В коде приложения Логирование запросов Внешние отладчики Без кода приложения Отладочные прокси
  46. 46. Спасибо! Дмитрий Рыбаков Руководитель мобильной разработки, Lamoda email dmitriy.rybakov@lamoda.ru http://tech.lamoda.ru

×