AndroidStudioで、APIの中身をサクッとみよう!

スクリーンショット 2024-02-01 8.02.15.png

はじめに

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

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

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

必須条件

httpクライアント

公式にも記されているように、

  • HttpURLConnection ライブラリ
  • OkHttp

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

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

使用方法

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

  1. Android Studioの下のタブにある “App Inspection” を開く
  2. Run “app” でビルドしてデバイスでアプリを起動する。
  3. “Select Process” のタブから、対象のデバイスを選択する(ビルド時に普通は自動で選択される)
    下図の、 “Pixel6a API 32….” の箇所のことです。
    image.png
  4. Network Inspectornのタブを開く

あとは、API通信があると、そこにトラフィック毎に流れてくるので、選択すれば中身を詳細に見ることができます。

使用例

Retrofitを使ってAPI通信を行うサンプルです。imgを返す場合は、そのimgも表示してくれます。

image.png
スクリーンショット 2024-02-01 8.02.30.png

注意点

  • 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機能を使うことでネットワーク通信を見れます。
ReactNativeでも同様で、フリッパー(Flipper) を使うと簡単にAPI通信が見られます。