Android Studioで、APIの中身をサクッとみよう！

はじめに

Android Studioを使っていて、APIを使用するときにレスポンスやリクエスト、ヘッダーなどをサクッと確認するための方法を紹介します。Log.dで確認している方はぜひこちらの方法を参考にしてみてください。

Network Profilerの画面

Android Studioの標準機能Network Profilerとは？

Android Studioには、標準でNetwork Profilerという機能が備わっています。このNetwork Profilerを使用してAPIのレスポンスやリクエストをJSON形式で見ることもできます。またヘッダーにJWTなどを付与している時にも正しく付与できているかを確認するのに重宝します。

必須条件

httpクライアント

公式にも記されているように、以下のみに対応しています：

HttpURLConnection ライブラリ
OkHttp

Retrofitなど、内部的にOkHttpを使うものも対応しています。

一方で、Ktorの場合は標準でCIOエンジンを使っていて動作しませんでしたが、エンジンをCIOからOkHttpに変更することでトラフィックを見られるようになりました。

使用方法

使用法はとても簡単です。インストールなど特に不要です。

Android Studioの下のタブにある "App Inspection" を開く
Run "app" でビルドしてデバイスでアプリを起動する
"Select Process" のタブから、対象のデバイスを選択する
Network Inspector のタブを開く

Select Processでデバイスを選択

あとは、API通信があると、そこにトラフィック毎に流れてくるので、選択すれば中身を詳細に見ることができます。Retrofitを使ってAPI通信を行う場合、imgを返す場合はそのimgも表示してくれます。

APIレスポンスの確認

Network Inspectorの詳細画面

注意点

build.gradleの設定で、次のような設定が入っていると正しく動作しないので、デバッグ時にはコメントアウトして外しておく必要があります：

isDebuggable = false
isMinifyEnabled = true
isShrinkResources = true
proguardFiles(
    getDefaultProguardFile("proguard-android-optimize.txt"),
    "proguard-rules.pro"
)

また、Network Profilerをずっとつけっぱなしにすると動作が重くなることがあるので、気づいたら停止するようにしておきましょう。

まとめ

Log.dでAPIを見るのはやめて、Network Profilerを使ってデバッグしましょう！

参考

Xcodeでも同様な機能として、Instrument機能を使うことでネットワーク通信を見られます。React Nativeでも同様で、Flipperを使うと簡単にAPI通信が見られます。