【Charles】端末通信を監視してデバッグしてみよう【HTTP通信】

皆さんお世話様です。

Androidエンジニアのじゅんじゅんです。

今年も残り半月を切ったところですが、クリぼっち・年末ぼっちが確定している感じでもあります。(笑えない)

今回のお話ですが、先日着任しているAndroidアプリ開発業務で
APIとの通信を監視しデバッグする機会があり、「Charles」というツールを使用しましたので
基本的な使い方等を解説していきたいと思います。

Charlesとは

PCやAndroid/iOSスマートフォンなどの通信の監視や、
APIへのリクエストや、APIからのレスポンスを改変したりなどできます。

私が使用した例としては、APIからのレスポンスを改変し
400系、500系エラー発生時のアプリ挙動を確認するために使用していました。

有料版と無料版があり、無料版に関しては30分に1度Charlesの再起動が行われるという制限を除き
30日間全機能を試用することができます。

使っていると煩わしさ前回なので、ライセンス購入してしまうことをおススメします。

インストール

公式ページから、ご自身が使用しているPCのOSにあったファイルのDLを行い、インストールを行いましょう。

https://www.charlesproxy.com/latest-release/download.do

インストール手順は難しくなく、規約に同意し「OK」を押していくだけになります。

設定

インストール後にCharlesを起動すると、以下のような画面が表示されます。

ここから簡単な設定を行いっていきます。

SSLプロキシの設定

画面上部のバーから「Proxy」->「SSL Proxy Setting」を選択し以下のウィンドウを表示させます。

「Enable SSL Proxying」のチェックボックスを「ON」に、
「Include」側の「Add」ボタンから、監視対象にしたい通信のHost/Portの指定を行います。

今回は、特に指定なしのためワイルドカード「*」を指定しています。

設定完了後は、「OK」でウィンドウを閉じましょう。

証明書のインストール

メイン画面に戻り、上部バー「Help」->「SSL Proxying」->「Install Charles Root Certificate」を選択し以下の画面を表示させます。

※Macの場合は、KeyChainのウィンドウが開きますので、Charlesの証明書に対して「すべて許可」の設定を行います。

「証明書のインストール」ボタンをクリックし、表示されるウィンドウに従って進めていきましょう。

証明書のインストールが完了したら、「OK」をクリックし、Charlesの再起動を行ってください。

ざっくり使い方

メインウィンドウ左側の一覧から、確認したい通信をクリックし
右側のリストで詳細が確認できるようになっています。

Androidエミュレータを使用した詳しい使い方については、
今回は、記事があまりにも長尺になりそうなので、次回解説していきます。

最後に

今年から始まったGOATブログですが、皆さん閲覧いただきありがとうございました。
私の担当はこちらが今年最後の記事となりますので簡単にお礼を述べさせていただきます。

来年以降も当ブログ記事をよろしくお願いいたします。

それでは、よいお年を！！

その他Android関連の記事

• 【Kotlin】ConstraintLayoutの相対的なView指定方法【Android】
• 【Android】入門！Activityのライフサイクルとは？
• JavaからKotlinに移行したAndroidエンジニアが困った！！スコープ関数について解説してみる
• 【Android】MVVMアーキテクチャについて
• 【Hyperion】Android開発でおすすめのライブラリ！Hyperionの紹介【Android】
• 【Android】実務で使えるアプリのレイアウト検証で使える知識～レイアウトの図り方・方法～
• 【ADB】コマンドで操作するAndroid開発 〜コマンド紹介編〜
• 【注意！】Androidアプリのリリースパッケージが変更？APK？AAB？【Android】
• AtomicDesignとは？簡単解説【デザインパターン】