コンテナから外へのHTTPリクエストをキャプチャしたい！

はじめに

はじめて触るアプリケーションの開発の担当になったときや、アプリケーションの調査やデバックをしたいときに、アプリケーションから呼び出しているAPIリクエストの内容やそのレスポンス内容を確認したいときがあったりします。
あとは、レスポンス内容を少し変えてアプリケーションの挙動の確認をしてみたかりもしたかったり。

前者は特定のログで見れるようにしてる場合もあるかもですが、必ずしもそうなっているとは限らないし、後者の特定のレスポンス時の挙動確認は、データかコードをいじらないとできなかったりするから結構大変だったりします。

そんなことが、アプリの変更（ほとんど）なしでできるツール、http-request-capture を作ってみました。

どんなツールなの？

対象のアプリケーションがローカルのDockerで動いていることが前提になります。
Webアプリのコンテナの横にhttp-request-captureのコンテナを起動させるだけで、Webアプリから呼び出されるHTTP APIのリクエスト／レスポンスをキャプチャでき、さらには、レスポンス内容を編集して、同じリクエストが来た場合に編集したレスポンスを返すように設定することもできます。

基本的にはWebアプリのコード編集がなくてもHTTP APIのキャプチャができますが、HTTPSのAPIを呼び出している場合は、証明書エラーを無視するような設定をアプリ側に入れる必要があります。

また、特別なプロキシを経由するようなリクエストの場合もキャプチャすることが可能です。

何ができるの？

サンプルとして、レポジトリのREADMEに、Wordpressのリクエストをキャプチャする例を載せてあるので、是非手元で動かしてみてください。

ここでは、READMEと同じ内容を日本語でも書いておきます。どんなことができるのかのイメージがつくと思います。

Wordpressのリクエストをキャプチャしてみる

ここでは、Wordpressの公式イメージをローカルで動かしてみて、コンテナから出ているAPIのリクエストをキャプチャし、さらにレスポンス内容を少し編集してアプリの挙動にどんな違いがでるか見てみたいと思います。

1. Wordpressコンテナのセットアップ

git clone https://github.com/s-shirayama/http-request-capture.git
docker-compose -f example/docker-compose.yaml up -d

1. http://localhost:8000/ を開く
2. 適当な値でWordpressの初期設定を行う
3. 設定したID/PWでADMIN画面にログインする

2. HTTP APIのリクエストのキャプチャ

2-1. http-request-captureコンテナを起動

CONTAINER_NAME=example_wordpress_1 \
NETWORK_NAME= \
docker-compose up -d

2-2. http-request-capture UI画面を開く

2-3. Check request/response

• プラグイン一覧ページを開く
  • http://localhost:8000/wp-admin/plugin-install.php?s&tab=search&type=term
• http://localhost:18080/　のページで　"update mappings / requests" をクリックする
• → ページを開く際に、裏側でリクエストされたAPIのリクエストとレスポンスを見ることができます。

• "show response body"をクリックすると、レスポンスの中身も見ることができます。

2-4. レスポンスを修正してみる。

• "add" をクリックして、モックレスポンスの登録をする。
• "update" をクリックして、レスポンスの修正モードに入る。
• "responseBody"のJSONのinfo.resultsを修正してみる。

• "update"をクリックして編集を完了する。
• もう一度プラグイン一覧画面を表示する。
  • http://localhost:8000/wp-admin/plugin-install.php?s&tab=search&type=term
• → ページング部分に表示されている数字が変更される。

Before

After

3. HTTPS APIのリクエストやプロキシ経由のリクエストをキャプチャしてみる。

http-request-captureが、大体どんな感じで動くのかのイメージができたかと思いますので、続きはレポジトリのREADMEのWordpressのリクエストをキャプチャする例を参照ください。

どうやって動いているの？

最後に、http-request-captureがどうやってリクエストをキャプチャしているのかを説明します。
こんな感じで、コンテナからでるリクエストを、

iptablesでhttp-request-captureに対して、ルーティングされるようにしています。このやり方は、Istioで外向けのリクエストをサイドカーのEnvoyにルーティングしているやり方を真似ています。

http-request-captureでは、透過プロキシ(elazarl/goproxy)をGolangで動かして、リクエストとレスポンスをキャプチャしています。そのキャプチャした内容をadminのUIを通してブラウザで見ることができるって感じです。さらには、UIから特定のリクエストに対してのレスポンスの編集ができたりします。この辺はWiremockというモックツールを参考にしています。

この辺の挙動もWordpressのリクエストをキャプチャする例で手元で確認できるので、是非見てみてください。