WordPressのPHPコードをFirePHPでデバッグ

PHPデバッグ環境構築のために FirePHP を導入してみました。
PHP Code Widget を導入したので気軽にPHPコードを記述出来る環境は出来たのですが、PHPのデバッグを行う方法が分からなかったので調べてみました。

PHPは、サーバー側で動作するスクリプト系言語で、あまり馴染みのない言語でしたが、WordPressを扱うには、マスターしなければなりません。(^_^;)

まずは、ウィジット内で実行するPHPの動作を確認出来るような簡易的なデバッグ環境が欲しかったので、FirePHPを使用して、PHPを学びながらプログラム作れるようにしたいとおもいます。

FirePHPインストール

FirePHPを動作させるには、サーバー側とクライアント側のインストールが必要です。

下記サイトを参考に環境を作ってみましたが、意外とデバッグに関する情報は少なくて、FirePHP にたどり着くまで検索しまくりました。
wordpressの流れを知るために、firephpとfireloggerを使ってみた。

サーバー側

FirePHPのサイトの案内に従って、サーバー側のライブラリをインストールします。
FirePHPCore archive に、いくつか方法が書かれていますが、pear コマンドでインストールするか、ダウンロードしたライブラリをFTPでアップロードします。

clip_image001

Pear ってよくわかっていませんので、ダウンロードのほうで行います (^_^;)

ダウンロードしたファイル FirePHPLibrary-FirePHPCore-0.3.2.zip を解凍して、その中の FirePHPCoreフォルダをFTPを使って、ドキュメントルート(通常は piublic_htmlフォルダ)下へアップロード。

次に wp-config.php ファイルに次の設定を追加します。

/**
 *FIREPHP setup
 */
require_once ("FirePHPCore/FirePHP.class.php");
require_once ("FirePHPCore/fb.php");
ob_start();
//FB::setEnabled(FALSE); 主電源

ちなみに、インストールは、動作確認用のテストサイト等に行います。デバッグ機能は、一般に公開するサイトでは使用しないほうが無難です。

クライアント側

クライアント側は、ブラウザの firefox あるいは、Chrome を使用します。

Firefox

アドオンから拡張機能の FireBug, FirePHP の2つをインストールします。

FireBugを起動したら青い虫のマークをクリックして、FirePHP を有効にします。

また、Variable Viewer とコンソール、ネットも有効にします。

clip_image002

Chrome

ツールから拡張機能の FirePHP4Chrome. をインストールします。

デベロッパーツールズを表示して、Console 画面を表示すると FirePHP4Chrome が自動的に有効となります

clip_image003

FirePHP実行

基本的な使い方は、PHPコード内で参照したい変数を FB::log()でログに出力すると、ブラウザの開発ツール上のコンソールに出力されたログから詳細なデータを表示させることが出来るようになります。

また、ログへの出力は、FB::log() 以外に FB:info()、FB:warn()、FB:error() がありメッセージの内容により使い分けてログを見やすくすることが出来ます。

試しに PHP Code Widget で関連記事表示 で使用したPHPコードで $category、$related_post 変数を表示させてみます。

関連記事を表示するコードに FB:log() 関数を追加

<?php
$post_id = get_the_ID();
$categories = get_the_category();
foreach($categories as $category):
FB::log($category);
$related_posts = get_posts(array('category__in' => array($category->cat_ID), 'post__not_in' => array($post_id),  'numberposts' => -1));
FB::log($related_posts);
if($related_posts): ?>
<ul>
<?php foreach($related_posts as $related_post): ?>
<li><a href="<?php echo get_permalink($related_post->ID); ?>"><?php echo $related_post->post_title; ?></a></li>
<?php endforeach; ?>
</ul>
<?php endif; endforeach; ?>

Firefox

コンソールに FB:log() 出力が表示され、ログをクリックすると詳細データが別ウインドウで表示されます。

clip_image004

Chrome

コンソールに FB:log() 出力が表示され、ログをクリックすると詳細データが展開されて表示されます。

clip_image005

どちらのブラウザを利用しても、表示の仕方が異なるだけです。

また、他の機能として ログをグループ化したり、配列をテーブル形式で表示させたりする機能もあります。さらに、トレース情報の表示を行うことも出来ます。

この辺りは、下記サイト等を参考にしてください。

Using FirePHP

Debugging PHP Code with FirePHP

FirePHPでPHPプログラミングを便利にする方法


これで最低限のデバッグ環境は、構築出来ました。

とりあえず一歩前進です (^^)

もっと本格的な開発環境もいずれは構築して行きたいと思います。

EclipseかNetBeansあたりが候補ですかね…


まとめ記事紹介

search star user home refresh tag chevron-left chevron-right exclamation-triangle calendar comment folder thumb-tack navicon angle-double-up angle-double-down angle-up angle-down quote-left googleplus facebook instagram twitter rss