こんにちは、サイオステクノロジー技術部 武井です。今回は、便利だなと思ったちょっとしたツールを備忘録も兼ねて紹介します。CharlesというツールでHTTPやHTTPSの通信を覗き見ることができます。Fiddlerみたいなものです。Macでも使えるのが嬉しいです。
仕組み
HTTPのプロキシとして動作します。HTTPの場合は普通のHTTPプロキシとして動作するので、その動きは容易に想像出来ると思いますが、面白いのはHTTPSプロキシとして働くときです。以下の図のように動作します。
(1) ユーザーは、ブラウザからHTTPSのWebサイトにアクセスします。このときブラウザのプロキシはCharlesに向けているものとします。
(2) Charlesがリクエストをプロキシして、HTTPSのWebサイトに到達します。
(3) HTTPSのWebサイトからSSL証明書を取得します。
(4) Charlesが、HTTPSのWebサイトから取得した証明書を、Charlesが発行したSSL証明書に置き換えます。この証明書はCharles内にある自己認証局がサインしたオレオレ証明書になります。
(5) ユーザーは、Charlesが発行した証明書を受け取ります。
(6) ユーザーは、Charlesが発行したSSL証明書で、HTTPSのWebサイトに送りたいデータを暗号化します。
(7) Charlesが発行したSSL証明書に対応する秘密鍵で、(6)で送付したデータを復号化します。
(8) 復号化されたデータをCharles内に保存します。このデータをCharlesの画面から見ることが出来ます。
(9) HTTPSのWebサイトのSSL証明書で、(8)のデータを暗号化します。
(10) (8)のデータをHTTPSのWebサイトに送付します。
上記の流れを見てみればわかるのですが、バッチリ(9)で復号化された生データを取得出来ています。
インストールと設定
以下のURLでダウンロード出来ます。
Charlesを起動して、「Help」→「SSL Proxying」→「Install Charles Root Certificate」の順にクリックします。
Macのキーチェーンアクセスを見てみると、Charlesで発行されたCA証明書があるのがわかります。
証明書をダブルクリックします。このCA証明書を常に信頼するようにしておかないと、ブラウザでアクセスしたときに警告が出たり、アクセスできないサイトが出たりしてしまいます。 以下のように「When using this certificate」を「Always Trust(常に信頼)」にします。
「Proxy」→「SSL Proxy Settings…」の順にクリックします。
「Add」をクリックして、以下のように入力して、「OK」をクリックします。これはCharlesがプロキシする対象のサイトを定義するもので、ここではすべてのサイトを対象にしています。
これで準備OKです。ブラウザのプロキシを変更しましょう。ブラウザとCharlesが同じPCにインストールされているのであれば、プロキシのホスト名は127.0.0.1、ポートは8888でOKのはずです。
では、試しにhttps://tech-lab.sios.jp/にアクセスしてみましょう。
HTTPSのサイトなんですが、バッチリSSL通信の中身を見ることが出来ます。
これがあれば、アプリ開発のときにHTTPS通信をモニタしたいときにすごく役に立つと思いおますヮ(ﾟдﾟ)ォ!
ちなみにですが、このソフトウェアは有償になります。無償でも利用は可能ですが、起動後30分経過すると自動で終了してしまうようです。
