CharlesでSSL通信を覗く(/ω・＼)

こんにちは、サイオステクノロジー技術部 武井です。今回は、便利だなと思ったちょっとしたツールを備忘録も兼ねて紹介します。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でダウンロード出来ます。

https://www.charlesproxy.com

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分経過すると自動で終了してしまうようです。

About 武井 宜行 269 Articles

Microsoft MVP for Azure🌟「最新の技術を楽しくわかりやすく」をモットーにブログtech-lab.sios.jp)で情報を発信🎤得意分野はAzureによるクラウドネイティブな開発(Javaなど)💻「世界一わかりみの深いクラウドネイティブ on Azure」の動画を配信中📹 https://t.co/OMaJYb3pRN

Twitter YouTube