X-ChromeLogger-Dataヘッダを使うとWebブラウザのコンソールにログを出力できる
【スポンサーリンク】
主なWebブラウザにはコンソール機能があるので、JavaScriptで console.log('Hello, world.');
と書くとコンソールにログを出力することができます。
X-ChromeLogger-Data
というHTTPヘッダを使うと、JavaScriptに限らず、サーバサイドのプログラミング言語からFirefoxのコンソールへログを出力することができます。次に示すのはPHPでX-ChromeLogger-Data
ヘッダを出力する例です。
<?php $log = array(); $log[] = array(array('Hello, world.'), 'log'); $json = array( 'columns' => array('log', 'type'), 'rows' => $log ); $data = base64_encode(utf8_encode(json_encode($json))); header('X-ChromeLogger-Data: ' . $data);
FirefoxはこのHTTPヘッダを受け取ると、コンソールへデコードした文字列を出力します。
出力するレベルは上記の例で示した log
のほかに、info
、warn
、error
を使うこともできます。
<?php $log = array(); $log[] = array(array('Hello, world.'), 'log'); // ログレベルを出力 $log[] = array(array('Hello, world.'), 'info'); // メッセージレベルを出力 $log[] = array(array('Hello, world.'), 'warn'); // 警告レベルを出力 $log[] = array(array('Hello, world.'), 'error'); // エラーレベルを出力
なお、Firefoxは X-ChromeLogger-Data
をデフォルトでサポートしていますが、Chromeの場合はChrome Loggerという拡張機能をインストールする必要があります。
Chrome Loggerでは各言語別のロギングライブラリも紹介しており、PHPのライブラリを使うと以下のように簡単に書くことができます。
<?php include 'ChromePhp.php'; ChromePhp::log('Hello, world.');
X-ChromeLogger-Data
はHTTPヘッダなので、XMLやJSON、PDFなど、余計な文字列を出力するとフォーマットとして成り立たないデータを表示する場合でも気軽にデバッグに使えそうです。