Google ChromeからのHTTPリクエストを監視するExtensionを作る

アクセスしているアドレスを一覧表示する方法のメモ - notes plastiques」の続きで、Google ChromeからどんなURLにアクセスしているかを解析するためのGoogle Chrome Extensionを作ってみた。案外と簡単に作成できた。
WebRequestAPIという試験的APIを使用する。

通常では試験的APIは使用を制限されているので制限解除するためにChromeを設定する必要がある。(後述)

Extensionの作り方はここが参考になる。

Extensionを作る

適当な名前でフォルダを作成し、これらのファイルを作成する。

{
  "name": "url analyse",
  "version": "0.1",
  "description": "url analyse",
  "permissions": [ "experimental" ],
  "browser_action": {
    "default_icon": "icon.png",
    "popup": "popup.html"
  }
}
  • icon.png
    • アイコン用。19x19で適当に。
  • popup.html
<a href="analyse.html" target="_blank">open</a>
  • analyse.html
<div id="capturelist"></div>
<script>
var capturelist = document.getElementById("capturelist");
chrome.experimental.webRequest.onBeforeRequest.addListener(function(details){
  capturelist.innerHTML += details.url + "<br />"
});
</script>

Extensionをインストールする

まず試験的APIの使用を可能にするために、about:flagsあるいはchrome://flagsを開き、「試験運用版の拡張機能 API」を探し、有効化する。実際に有効化するには再起動が必要なので、再起動すること。

拡張機能のページ( chrome://extensions/ )を開き、右上の「デベロッパーモード」をクリックすると、ボタンが出てくるので「パッケージ化されていない拡張機能を読み込む…」をクリックし、フォルダ選択ダイアログが開くので、先ほど作成したExtensionのフォルダを選択し、拡張機能として登録する。
そうすると、右上の拡張機能のアイコンが並んでいるところに、今回作成した拡張機能のアイコンが現れるので、クリックする。そうすると、openというリンクが書かれたポップアップが現れる。そのリンクをクリックすると、新しいタブが開く。真っ白の何も書かれていないページの筈だ。
そのタブを開いたままにして、どこかページにアクセスしてみる。その後、先ほどひらいた拡張機能のタブにもどるとURLがずらっと一覧表示されているはず。めでたし。


これでいろいろ遊べそうですね。WebRequestAPIが実際に正式APIとして生き残るかは謎ですが…
あと、拡張で自動的にダウンロードして保存ができれば完璧なのだが、やり方は分からない。ひょっとしたら出来ないのかもしれない。

検証したChromeのバージョン:12.0.742.122