Різні способи дебага запитів з Android-пристроїв і емуляторів

Багато розробники стикаються з питанням: «Як подивитися те, що додаток відправляє в мережу і як побачити відповідь від сервера?». Існує безліч різних варіантів профайлінгу, але описати все буде досить проблематично. Для себе я виділив 5 способів, якими поділюся з вами:

Android Studio Profiler (Network) — нативний профайлер Android Studio;
OkHttp Profiler — плагін для Android Studio/IntelliJ IDEA;
Facebook Stetho — «міст» між додатком і дебагером браузера;
Charles — проксі-додаток для роботи з мережею;
AppSpector — бібліотека віддаленого профайлінгу.

Всі вони мають свої плюси і мінуси, але однозначно дозволять вам зробити профайлинг роботи з мережею зручним і прозорим.

Android Profiler

З кожним роком розробники Android і Android Studio роблять життя програмістів все простіше і простіше. У студії 3.0 був доданий відмінний функціонал — Advanced Network Profiling . Він може відобразити кількість відправлених/отриманих даних, таймінг мережі, а головне, з допомогою нього ви можете побачити запити безпосередньо в Android Studio.

Щоправда, є певні обмеження — підтримка тільки HttpURLConnection або OkHttp , але, думаю, цього достатньо з головою.

Отже, для включення розширеного набору:

1. Треба зайти в меню Run > Edit Configurations .

2. Вибрати свій модуль в лівій частині.

3. Перейти в Profiling вкладку праворуч і включити Enable advanced profiling .

4. І тепер скомпілювати і запустити проект.

Потім відкриваємо Profiler і вибираємо Network . Після цих маніпуляцій бачимо запити в реальному часі, і якщо виділимо якийсь часовий інтервал, то з'явиться детальна інформація:

Всю цю нехитру налаштування і використання ви можете переглянути на відео .

З плюсів такого методу я можу виділити наступні:

нативна реалізація Google;
можна дивитися і зображення і текстові відповіді;
є таймінги, що дуже важливо для аналізу швидкодії.

З мінусів:

постійно треба виділяти ділянку часу — немає загального списку запитів;
треба тримати активної сесію профайлера;
немає відображення JSON у вигляді дерева.

OkHttp Profiler plugin

Плагін до Android Studio /Intellij IDEA , який відображає запити бібліотек OkHttp /Retrofit безпосередньо в IDE. У нього вбудована можливість створення Java/Kotlin моделей для Gson десериализатора з отриманого JSON-відповіді.

Для активізації плагіна необхідно додати Interceptor-бібліотеку у build.gradle файл (на рівень модуля):

dependencies {
//...............
 implementation 'com.itkacher.okhttpprofiler:okhttpprofiler:1.0.3'
}

І підключити її до OkHttp-клієнту:

OkHttpClient.Builder builder = new OkHttpClient.Builder();
if (BuildConfig.DEBUG) {
 builder.addInterceptor(new OkHttpProfilerInterceptor());
}
OkHttpClient client = builder.build();

Вимикаємо за замовчуванням зайві обробники для релізних білдів — вони там ні до чого. Далі встановлюємо сам плагін, викликаючи меню налаштувань:

Preferences -> вкладка Plugins -> тиснемо на кнопку Browse repositories... -> вводимо OkHttp Profiler.

У списку відображається плагін останньої версії, тиснемо Install іRestart.

Внизу праворуч з'явився «OkHttp Profiler » — відкриваємо його і пересобираем проект. Тепер всі вихідні запити будуть відображатись у цьому вікні.

Невелике демо використання. Додаткова інформація про установці тут .

З плюсів цієї бібліотеки можу відзначити такі:

є повний список запитів, відсортований по даті відправки;
можливість переглянути JSON в зручному вигляді — текстовому або дерево;
можливість в один клік створити Java/Kotlin модель для Gson-парсера прямо з відповіді сервера.

З мінусів:

необхідність додавання сторонньої бібліотеки;
є невеликі затримки відображення контенту запиту.

Stetho

Профайл-рішення від компанії Facebook , яке припаде до душі тим, хто вже дебажил веб в браузері Chrome. Ця бібліотека створює якийсь міст між вашою програмою і браузером, за допомогою якого відображаються дані по мережі, бази даних і view ієрархії.

Для включення треба додати саму бібліотеку у build.gradle:

dependencies { 
 implementation 'com.facebook.stetho:stetho:1.5.0' 
 implementation 'com.facebook.stetho:stetho-okhttp3:1.5.0' // якщо ви використовуєте OkHttp 
 }

І ініціалізувати її в onCreate методі MainActivity:

class MainActivity extends AppCompatActivity {
@Override
 protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Stetho.initializeWithDefaults(this);
 } 
}

Для OkHttp-клієнта треба додати interceptor при ініціалізації:

new OkHttpClient.Builder()
 .addNetworkInterceptor(new StethoInterceptor())
.build();

Запускаємо додаток з усіма змінами, відкриваємо Chrome-браузер і вбиваємо в рядок адреси chrome://inspect/#devices .

Натискаємо «Inspect » біля додатки.

У вкладці Network буде будуть з'являтися всі вихідні запити.

З плюсів можу відзначити:

якщо ви користувалися дебагом в Chrome раніше, цей спосіб буде вам зручний;
крім нетворкінгу ви можете бачити базу даних і layout програми;
досить-таки просте підключення.

З мінусів:

необхідність підключення сторонньої бібліотеки;
вікно профайлера знаходиться окремо від студії.

Charles Proxy

Проксі-додаток, що відображає весь вихідний і вхідний трафік з пристрою. Воно також містить багато інструментів для роботи з мережею: складання нових запитів, переадресація, зміна параметрів мережі (імітація поганий зв'язку), відображення підключених сокетів. Додаток платне, але його можна використовувати без покупки (буде вимагати перезавантаження через певний інтервал часу).

Для спрямування всього трафіку через Charles необхідно налаштувати і пристрій, і сам проект. Розглянемо на прикладі нативного емулятора з Android 8.0 на борту.

Качаємо програму за посиланням (є версії для Windows, Mac, Linux).

Відкриваємо налаштування емулятора:

Preferences -> Network & Internet -> Wi-fi -> Edit -> Settings icon

І вводимо:

Proxy: Manual
Proxy hostname: 10.0.2.2 (це не локальний IP, просто завжди використовуйте 10.0.2.2)
Proxy port: 8888

Натискаємо Save .

Тепер потрібно встановити сертифікат безпеки, щоб ми могли бачити HTTPS-запитів.

Повертаємося на головний екран емулятора і вводимо chls.pro/ssl в рядок пошуку. Емулятор збереже файл, відкриваємо його (або натиснувши на push notification або просто в папці Downloads). Система попросить ввести ім'я сертифікату — туди вбиваємо будь-яке значення (ім'я не впливає ні на що). Потім буде запропоновано убезпечити систему, вибираємо простий пін і встановлюємо щось типу 1111 — це теж не має значення.

І це ще не кінець :)

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

Відкриваємо наш проект у папці ресурсів (res ) створюємо папку xml , в ній вже створюємо файл network_security_config.xml.

І додаємо туди рядки:

<?xml version="1.0" encoding="utf-8"?>
<network security-config>
<debug-overrides>
<trust-anchors>
 <certificates src="system" />
 <certificates src="user" />
</trust-anchors>
</debug-overrides>
</network-security-config>

В результаті ми отримаємо наступну картину:

Потім додамо налаштування AndroidManifest.xml відкриваємо його і додаємо android:networkSecurityConfig="@xml/network_security_config"у application tag.

І це ще теж не все :)

Відкриваємо Charles , меню Proxy -> SSL Proxing Settings...

У спливаючому вікні ставимо галочку в чекбокс Enable SSL Proxying і додаємо домени, з якими буде працювати наш додаток.

Тепер пересобираем наш проект і дивимося результати в Charles.

З плюсів такого способу:

зручне відображення запиту і відповіді;
є можливість змінювати параметри мережі;
будь-який запит можна повторити/редагувати;
можливість працювати з сокетами.

З мінусів:

не сама проста установка;
1 ліцензія на Charles коштує $50;
необхідність включення/вимикання проксі на пристрої (якщо включити без Charles мережа не працює);
профайлинг окремо від Android Studio.

AppSpector

Рішення для набору мережі і не тільки. Через нього можна подивитися базу даних, логи, системну інформацію.

Для підключення необхідно зареєструватися на сервісі .

Після реєстрації вам будуть показані актуальні коди з'єднання з потрібним ключем.

Треба додати таке уbuild.gradle проекту:

buildscript {
 repositories {
jcenter()
google()
 maven {
 url "https://maven.appspector.com/artifactory/android-sdk"
}
}

 dependencies {
 classpath "com.appspector:android-sdk-plugin:1.0.4"
}
}

apply plugin: 'com.android.application'

І в build.gradle модуля:

// Put AppSpector plugin after Android plugin
apply plugin: 'com.appspector.sdk'

repositories {
 maven {
 url "https://maven.appspector.com/artifactory/android-sdk"
}
}

dependencies {
 implementation "com.appspector:android-sdk:1.0.4"
}

Потім додати інструмент Application:

import android.app.Application;

import com.appspector.sdk.AppSpector;

public class AmazingApp extends Application {

@Override
 public void onCreate() {
super.onCreate();

 // We recommend to start AppSpector from Application#onCreate method

 // You can start all monitors
AppSpector
.build(this)
 .withDefaultMonitors() 
.run (YOUR_CODE");
}
}

Після запуску проекту з цими змінами в кабінеті користувача з'явиться кожен девайс, на якому запустили додаток.

Вибравши пристрій, бачимо різні області профайлінгу, в тому числі і мережа.

Отже, плюси:

є постійно зберігається список відправлених/отриманих даних;
запит можна подивитися в зручному вигляді;
можливість профайлінгу бази, логів т. д.

Мінуси:

багато залежностей при підключенні;
йде вся інформація з пристрою (всі логи, запити, відповіді, база даних) і зберігається на сторонньому сервісі в мережі, що трохи небезпечно;
профайлинг окремо від Android Studio;
зараз AppSpector в беті, і він безкоштовний. Але анонсовано, що в жовтні 2018 з'являться ціни за використання (зараз вже листопад, але їх поки немає).

Висновок

Плюси і мінуси засновані виключно на моїх міркуваннях, так що вони суб'єктивні і можуть відрізнятися від ваших. Якщо ви знаєте, використовуєте ще якісь способи, які зручні і доступні — милості прошу залишити коментар під текстом :)

Всім добра.

Опубліковано: 09/11/18 @ 11:08
Розділ Пошуковики

SEO Блог