開発環境

> > > XdebugとVimを使ったPHPのリモートデバッグ

XdebugとVimを使ったPHPのリモートデバッグ

2012-09-20 11:24 - インターエデュ

インターエデュでウェブエンジニアをやっている野澤です。今日はXdebugを使ったリモートデバッグについて簡単にまとめたいと思います。

普段私はあまりデバッガを使った開発はせず、ほとんどprintデバッグが中心で、ブラウザにプログラムの内容を表示させたり、エラーログを確認しながら開発しています。自分たちが開発したプログラムであれば、どこがどういう仕組になっているかはある程度把握しているので、それで十分ではあるのですが、wordpressなどのオープンソースを使った開発になると、内部でどのような処理が行われているかを確認する必要が出てきます。しかしオブジェクト間の依存関係や、階層が深くなってくるとどうしてもprintデバッグだけでは時間がかかってしまいます。

そこでPHPのデバッガであるXdebugの登場です。

XdebugはPHPの拡張モジュールであるPECLパッケージの一つとして提供されています。私の開発環境には欠かせない機能の一つです。Xdebugを使うと、エラーが発生した時に自動的にスタックトレースをHTML形式に変換して表示してくれたり、ローカルスコープの変数を出力してくれたり、var_dumpの出力結果を色付きで見やすくしてくれます。

Xdebugにはリモートデバッグ機能がついていますが、あまり使ったことはなく、今回改めてきちんと導入しようと思い、調べてみました。

インストール手順(Fedora 15、PHP 5.3.13の場合)

詳しくは公式サイトを見てくださいね。
http://xdebug.org/docs/install

下記の一形を追加します。

それから下記のコマンドを実行して、

xdebugの記述があればインストールは完了です。

ちなみに私はXdebugの設定を下記のようにしています。

またvar_dumpの出力結果を見やすくするにはhtml_errorsの設定が必要です。(いつも忘れる・・・)

プログラム上でvar_dumpを実行したり、エラーを発生させてみてください。
こんなかんじになります。

リモートデバッグについて

リモートデバッグを有効にするにはphp.iniの設定を下記のようにします。

こちらも詳しくは公式マニュアルを。
http://xdebug.org/docs/remote

デバッグクライアントとしてはeclipseやnetbeansもあり、GUIで非常に見やすいと思います。ただ私はこうしたIDEよりもVimにプラグインを入れたりして開発しているので、今回もVimで使えるデバッグクライアントを入れてみました。

DBGp client
http://www.vim.org/scripts/script.php?script_id=1929

上記のサイトから最新のzipファイルをダウンロードして解凍します。

解凍するとこんなかんじです。

この二つのファイルをユーザーディレクトリ直下の.vimディレクトリの下のpluginディレクトリにコピーします。

これでインストールは完了です。

使い方

まずvimを開きます。おなじみのウガンダのメッセージが表示されます。
この時にF5ボタンを押すと、デバッグの受け入れが始まります。

デバッグしたいページをブラウザで開きます。
この時にURLのパラメータにXDEBUG_SESSION_STARTという文字列を追加します。

このへんの設定が面倒くさかったので私はeasy XdegugというFirefoxのプラグインをインストールしました。netbeansでのデバッグが楽になるみたいな記述がありますが、別に関係なく使えるようです。これは知らなかった。

Vim側でF5を押したあと、5秒以内にFirefoxの右下にあるプラグインバーの虫マークを押してxdebugのセッションをスタートさせ、デバッグしたい場所のURLにリクエストします。そうするとvimにこんなメッセージが表示されるのでenterを押します。

これでようやくリモートデバッグ開始です。

左側にエディタです。右側は上から順に、変数内容の出力結果、ヘルプ、スタック、トレースです。:Bpと打つとブレークポイントが打たれます。画面の緑のラインがブレークポイントを打ったところです。セッション中にF5を押すとブレークポイントまで進みます。F2でステップインです。ノーマルモードで”,e”と打つと右上のWATCH_WINDOWのところがフォーカスされるので変数を指定してEnterを押すとその時点での変数の内容が出力されます。

ステップインとかステップアウトの違いが分かりにくかったのでまとめました。

  • ステップイン: 1行単位で実行
  • ステップオーバー: 1行単位で実行されるが、関数があった場合その関数を実行して次の行に移行する
  • ステップアウト: 今実行している関数の外(呼び出し元)に出るまでプログラムを進める

だそうです。こちらのサイトを参考にしました。

実際に使ってみると割りと簡単です。予め詳しく見たい場所がわかっているならデバッグセッションがスタートしたあとに:eで該当ファイルを開き、ブレークポイントを打ち、F5を押せばそこまで進めてくれます。

逆に頭からコードの流れを知りたければステップインしていきます。ある程度理解できたらステップオーバーしたり、ステップアウトしてとにかくコードの流れを追っていきます。

私はある程度メインの処理を架空のオブジェクトとメソッドで記述して、あとから具体的なクラスを記述し、そのあとプリントデバッグしたりします。でも前後関係やライブラリのオブジェクトを追っかけるときに便利そうですね。

ちなみにajaxのデバッグをするときはtimeoutの設定を忘れずに。jQueryの$.ajaxとかでもtimeoutを設定すれば、長くデバッグセッションを継続できるはずです。下記はwordpressのcontact-form-7プラグインのjavascriptの一部でフォーム送信をさせる処理のところです。ここにtimeout: 300を入れています。

長かった・・・。参考になれば幸いです。