【2019年12月版】mitmproxyでアプリの通信内容を確認したい

# アプリ開発初心者なので
先日、自社で作成したアプリの最終チェックに関わったんですが、その時に「通信内容見たいな～」って思ったんですよ。まあサーバ側が見れればそこで見ればいいんですけど、昨今のアプリはいろんなところと通信するので、すべての通信内容を見れなかったりする事情もあるわけで。なので、そういう時に気軽に通信内容をチェックできるMan-In-The-Middleなproxyを立ててみようと思いました。

# mitmproxy
ググると一発目でこいつに行き当たりました。ふーん、Fiddlerじゃないんだ。
Qiitaにも当然のように記事がたくさんあったので、まずは入れてみて動かしてみましょう。

# 導入手順
## WSL導入
動作環境はWindows 10なので、まずはWSLを有効化します。
スタートメニューを右クリック->アプリと機能を選択。
![2019-12-21_11h13_18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/997c817d-9d9a-e54f-060c-b325b47aa2d6.png)

アプリと機能を選んでいきます。
![2019-12-21_11h15_16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/a802f2c2-bdaf-3430-f38b-65ac07dad377.png)

次にWindowsの機能の有効化・・・を選びます。
![2019-12-21_11h15_41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/7d4dcbff-5ef0-5946-174b-da5959cf1978.png)

ここでWSLを有効化します。
![2019-12-21_11h17_25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/b41a4aa0-155b-2aab-130b-efafd3d646ea.png)

次にWindowsの設定を開き、
![2019-12-21_12h18_28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/aa12a324-953b-a34f-2195-a92078bdba4f.png)

開発者モードをOn!
![2019-12-21_12h18_54.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/d8f41d1c-00b1-5a94-b208-e70adb8ba6cc.png)

再起動が求められたりするので、立ち上がったらWindows Storeでubuntuを探しましょう。
![2019-12-21_12h22_13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/ea001667-7630-c54a-f933-1af9aae80e4f.png)

はい。特に理由がなければLTSで。
![2019-12-21_12h22_29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/e5dd7605-6495-f811-e4b5-96117c1c72db.png)

無事立ち上がります。
![2019-12-21_12h26_02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/85a8aac9-b6b2-4753-d5d0-45a588338a98.png)

## mitmproxyのインストール
mitmproxyの導入はaptのおかげで至極簡単です。

```
sudo apt install python3-pip && sudo pip3 install -U pip && sudo pip3 install mitmproxy
```

![2019-12-21_12h28_56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/e653cb8f-d81d-f70c-4a7d-21ef4af03a38.png)

## mitmproxyの起動と端末側の準備
シェルでmitmproxyとたたけば立ち上がります。
![2019-12-22_07h44_17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/30c70bd4-3cbf-080c-5bbd-348c926c9c2f.png)

SHIFT + Fでfollowモード（tailみたいな感じ）にしておきましょう。

これでmitmproxyが起動しましたが、準備はまだ終わっていません。端末側にproxyの設定と、mitmproxyの証明書をインストールする必要があります。
まずはproxyの設定。ポート指定してない場合は8080です。
![1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/17a8d819-794a-2814-6ca1-7185ae43c63b.png)

次に証明書です。
端末側でブラウザを開き、mitm.itとアドレスに打ち込みます。
![2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/a7b9363d-1491-ed73-7dd2-5f0c5692f875.png)

利用する端末のアイコンを選択して、証明書をダウンロードします。
<img width="375" alt="IMG_0104.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/dda73fc3-52ff-51b0-b1cd-50ec6776cfdf.png">

iOSの場合、これだけでは証明書が有効にならないようです。
設定を開くとプロファイルのインストールがアラートとして出てくるので、それを選択します。

<img width="375" alt="IMG_0108.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/03215e44-26f4-5f87-fa39-e71500390690.png">

<img width="375" alt="IMG_0105.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/93e06190-adb8-1a62-7af8-7590f78f34f0.png">

最後に、設定 > 一般 > 情報 > 証明書信頼設定で有効にしておく必要があります。
<img width="375" alt="IMG_0111.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/fc73021f-afb1-3480-1138-6834a017a1b0.png">

# 使ってみる。
まずはqiitaでも見てみましょう。（ブラウザですが）
<img width="375" alt="IMG_0119.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/203c9c44-d9fd-716b-51ef-7d695b91af12.png">

mitmproxyの方。よしよし。丸見えですね。
![2019-12-22_08h13_52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/50b1229d-2e09-f113-9d22-10651cfaa573.png)

アプリも見てましょう。例としてsmartnewsを開いた時の通信を見てみました。
![2019-12-22_08h16_59.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/0efce0cf-68e2-4f5d-07f7-98d5969b76d2.png)

いい感じです。

# 見れないアプリもある。
証明書のpinning（これ、なんて訳すんでしょうね）という方法で中間者攻撃を無効化するというのは、比較的いろいろなアプリで実施されているようです。
先ほどsmartnewsの通信を垣間見ましたが、yahoo newsでは通信を見ることができません。証明書のpinningに対応しているものと思われます。
![3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221091/b6cd8fe0-d000-8f39-2c20-3d2af5d14fe6.png)

同様に、以前は通信内容を見ることができたAmazonなどのアプリも、中間者攻撃に対して対策がされているようで、mitmproxy動作下では正常に動作しないようです。
対策がされているアプリとそうでないアプリを調べていくのもなかなか楽しそうです。
逆に言うと、自分たちが作るアプリでも同様のことをしなくてはいけないケースを想定しなくてはいけませんね。