chrome.webRequestとdata URI schemeを使ってダミーデータを返す

More than 5 years have passed since last update.

Chromeの拡張機能ではchrome.webRequestというAPIが提供されており、これを使って特定のURLへのアクセスを別のURLへリダイレクトさせることができます。

この時リダイレクト先のURLをdata URI schemeで指定してあげることで、既存のページへのリダイレクトだけでなく任意のデータを返す事が出来ます。

JavascriptのXHRのテストで使うこともあるかなーと思ったので、拡張機能として使えるところまで作ったものをChrome Web Storeにて配布中です。


バーミッションの設定

chrome.webRequestでリダイレクトを行う場合は、

manifest.jsonのパーミッションで"webRequest"と"webRequestBlocking"、それとwebRequestで監視するURLを指定します。


manifest.json

{

"permissions": [
"webRequest",
"webRequestBlocking",
"*://example.com/*"
]
}


イベントのハンドル

chrome.webRequest.onBeforeRequestイベントをハンドルし、その戻り値として返すオブジェクトのredirectUrlプロパティをdata URI schemeで指定することで、任意のデータを返す事が出来ます。ここでは使用していませんが、リクエストに関する詳しい情報はハンドラの引数detailより取得できます。


background.js

chrome.webRequest.onBeforeRequest.addListener( function( detail ) {

return {
redirectUrl: "data:application/json,{\"message\": \"hello\"}"
};
}, {
urls: "*://example.com/*"
}, [
"blocking"
] );

上記の例ではテキストデータを返していますが、BASE64エンコードされていれば画像だろうがなんだろうが返すことが出来ます。


その他

拡張機能として形にしたもの > Chrome Web Store

ソースコード > GitHub