7
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【mitmproxy】モバイルアプリで通信監視したい人へ

Last updated at Posted at 2023-06-16

0. 初めに

モバイルアプリの通信監視をしたい時、Charlesを使用するのが便利だと思います。
Charlesは通信監視機能だけでなく、特定の通信だけを見るフィルタリングや、レスポンス内容の書き換えができたりと、使用している方も多いのではないでしょうか?

しかし、便利さと引き換えに無料版は30日間しか使用できないという制約があります。。。

先日それで大変困ったところ知り合いにmitmproxyをお勧めしていただき、これが大変便利だったので、今回まとめました。

以下、皆さんの参考の一助になれば幸いです。

前提事項

  • MacBook Pro(M1搭載)でmitmproxyを使用する

  • MacPCとは別の、iOSデバイスの通信を確認する

目次

  1. mitmproxyとは?
  2. インストール手順
  3. 終了方法
  4. 基本的な使用方法
  5. 参考

1. mitmproxyとは?

概要

  • mitmproxyは、インタラクティブなコンソールインターフェースを持つオープンソースのネットワークプロキシツールです。主な機能は、ネットワーク通信(特にHTTPとHTTPS通信)を中継し、観察し、変更し、リダイレクトすることです。
  • これにより、特定のネットワークリクエストやレスポンスの詳細を確認したり、それらを変更したりすることができます。

基本的なしくみ

  • 基本的なコンセプトとして、ネットワーク上で情報が送受信されるとき、「リクエスト」(要求)と「レスポンス」(応答)の形式で行われますが。通常、このリクエストとレスポンスは直接、クライアント(あなたのコンピュータ)とサーバー(ウェブサイトをホストしているサーバー)の間でやりとりされます。mitmproxyは、このリクエストとレスポンスの間に入る「中間者」です。つまり、クライアントとサーバーの間に立ち、通信を中継します。
  • 使用者のコンピュータ(クライアント)は、リクエストを直接ウェブサーバーに送る代わりに、そのリクエストをmitmproxyに送ります。次にmitmproxyはそのリクエストをウェブサーバーに送り、レスポンスを受け取ります。そして、そのレスポンスをあなたのコンピュータに戻します。
  • この流れの中で、mitmproxyは全ての通信を見ることができます。そして、必要に応じてリクエストやレスポンスを変更することもできます。これにより、ある特定のリクエストがどのようなレスポンスを引き起こすのかを確認したり、通信の様々な側面をデバッグ(調査)したりすることができるのです!

まぁ長ったらしいことは後にして、実際にインストール手順を見ていきましょう!

2. インストール手順

Step1. PCへのインストール

  • まず、terminalにて、以下のコマンドからインストールしましょう。
    (体感15~20分くらいかかったかも)
mitmproxyをbrewインストール
brew install mitmproxy

注意
mitmproxyはPython製のソフトウェアなので、Pythonとそのパッケージマネージャpipが先にインストールされている必要があります。
その際は、公式URLからインストールしましょう。

Step2. iOSデバイスのプロキシを手動に設定

  • モバイル端末を使用する場合、iOSデバイスのWi-Fi設定を変更し、
    その通信(Wi-Fi)がMac上のmitmproxyを経由するように設定する必要があります。
  1. iOSデバイス上で「設定」アプリを開き、「Wi-Fi」を選択する
  2. 接続中のWi-Fiネットワークを選択し、その詳細設定画面を開く
  3. 一番下までスクロール。「プロキシ」を選択し、「手動」を選択する
  4. 「サーバ」と「ポート」にそれぞれMacの使用している Wi-FiのIPアドレスとmitmproxyがリッスンしているポート番号(デフォルトでは8080)を入力する

下記は、使用しているMacの システム設定 > Wifi > Wifiの詳細 > TCP/IPから確認可能
(図1を参照)
サーバー:Macの使用している WifiのIPアドレス
ポート:mitmproxyがリッスンしているポート番号(デフォルトでは8080)

図1

Step3. 証明書のインストール

  • mitmproxyの証明書をiOSデバイスに入れ、有効化します。
  1. iOSデバイスからsafari(ブラウザはなんでもOK) > “mitm.it“を検索
  2. 図2から"iOS"をダウンロード
  3. iOSデバイスの設定 > 一般 > VPNとデバイス管理 からmitmproxyを”インストール”する
  4. インストールし、信頼すると図3のように表示される
  5. iOSデバイスの設定 > 一般 > 情報 >証明書信頼設定 からmitmproxyを図4のように有効にする
図2
図3
図4

Step4. mitmproxyを起動する

  • MacPCのterminalから起動します。
    (8080の部分は、Step2で設定したポート番号です。)
mitmproxyを起動
mitmweb -p 8080 

image.png

  • 起動すると以下のように表示されます。

image.png

  • iOSデバイス側で通信を使用すると以下のように表示される。

image.png

3. 終了方法

Step1. mitmproxyを終了する

  • terminalで開いたmitmproxy上で”control + c”で終了する

Step2. iOSモバイルでの終了処理

  • 設定 > Wi-Fi > Mac が接続している Wi-Fi と同じネットワークのi アイコン > プロキシ構成 > オフ にする

4. 基本的な使用方法

その1. フィルタリング

  • 特定の通信のみを表示することができます。
  1. 以下のように、start タブのsearchに表示したいURLを記載する
    image.png

  2. 以下のように対象のURLのみ表示されます
    image.png

その2. インタセプティング

  • インタセプティングというのは特定の通信を傍受することです。またそのままres, reqを書き換えることができます。
  1. start タブのinterceptに書き換えをしたいURLを記載する

  2. iOSデバイスでその通信を繋ぐ
    image.png

  3. 選択して"aキー"でリクエストを通すことが可能

  4. リクエストを通すと、レスポンスを補足し、止まる

  5. ペンのアイコン「edit」をクリックすると編集モードに入り、編集可能

  6. 編集が終わったらチェックマークをクリックする

  7. "aキー"でリクエストを通すことが可能

上記のようにすることで、proxyを通った通信の傍受をし、内容の編集ができます。
※ちなみにzキーで通信を全て削除できます。

5. 参考

7
6
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?