【PHPへ xdebug導入】は簡単。実はEclipseで動かす設定が環境依存で若干ややっこい
EclipseでPHPのデバッグをしながらプログラムを書く。
当たり前の環境のようで、それでも未だによく分からないからと、
var_dump、print_r、echoを使っているなら、xdebugに切り替えたらいかがでしょう。
実際に設定して動かすまでの手順をご紹介します。
ローカル環境のApacheを勢いで2.2から2.4へアップしたついでに、
せっかくなのでPHPのデバッグ環境xdebugのインストールも行いました。
「xdebugを導入をしたものの動かない」といった経験をされている方も、
意外と多いのではないかと思います。
インストール自体は他のWebで紹介されている方法で、ほぼ同じです。
そうなんです、紹介されている方法は間違っていない。んだ、これが。
ただ、自分の環境にあった設定の読み替えが、
非常にわかりにくいのが、デバッグ環境構築の敷居の高さなんですね。
というのも、私もこれまでPHPのデバッグ環境が欲しくて、
何度となくチャレンジしてきましたが、かれこれ５年以上放置・挫折してきた者です。
今回、うまく構築できたからと言って、次もできるとは限らない。
はい。未来の自分への備忘録として書き残しておくのが目的なんです^^;
概要
PHPへxdebugの導入と動作確認
xdebugをインストールするには、
まずxdebugのモジュールをダウンロードする必要があります。
自分のPHPのバージョンとApache環境にあったものをダウンロードします。
ダウンロードするファイルの選定
今回PHPは以下から、
「php-5.6.36-Win32-VC11-x64.zip」をダウンロードしてインストールしました。
参考：PHP For Windows: Binaries and sources Releases
またApacheは以下から、
「httpd-2.4.33-x64-vc11-r2.zip」をダウンロードしてインストールしました。
参考：Apache Haus Downloads
バージョンは皆さまの環境で異なることでしょうけどもここでは以下でご紹介します。
- PHP：5.6（64bit）
- Apache：2.4（64bit）
分かりにくいのがスレッドセーフ、ノンスレッドセーフという違いです。
厳密には違うのかもしれませんが、
- Apacheならスレッドセーフ（TS）
- IISならノンスレッドセーフ（NTS)
そう考えておいて問題ないようですので、今回はTSを選択する事になります。
PHP5.6と書かれていて、64bit（x64)で、スレッドセーフ（TS）に対応した、
xdebugをダウンロードします。
以下の太字がそれに該当します。
Xdebug 2.5.5
Release date: 2017-06-21
- source (SHA256: 72108bf2bc514ee7198e10466a0fedcac3df9bbc5bd26ce2ec2dafab990bf1a4)
- Windows binaries:
PHP 5.5 VC11 (64 bit) (SHA256: 44e5f00131f94e7e057b421f7a987e3feb6cdd612a0b2fdd6ddbf7236d458860)
PHP 5.5 VC11 (32 bit) (SHA256: 9f5f7613de935b0f3b2793940c0c9e629eb879dec9d6b8dd2adc9e48c923aa32)
PHP 5.5 VC11 TS (64 bit) (SHA256: 44874c2360dd63591d75da6f08213c1d71f5578cabff7935cd015c364f47d2ab)
PHP 5.5 VC11 TS (32 bit) (SHA256: 1f8bb426d7a151b37bf3d42ff7163ff64f9a7a9537205c1d18d70e6d22750999)
PHP 5.6 VC11 (64 bit) (SHA256: 990e457e05e0f8678db21534931b0699d89d5f06d9ee42e26cde9f225c4e4b8b)
PHP 5.6 VC11 (32 bit) (SHA256: d1fdcb4e7ff0de6d1b70fdb37a09a78178aab60d52e1999cc6776e1447c7b723)
PHP 5.6 VC11 TS (64 bit) (SHA256: 8ac0b0e148e437abcf9acf2baf0b40b356cb1a248c53807a5b956e7f8c5acc68)
PHP 5.6 VC11 TS (32 bit) (SHA256: 5b24d00b725370024d308ec58fd00a189980cf7b2cde58e20e2e0f3b0f6a8825)
PHP 7.0 VC14 (64 bit) (SHA256: b16b98782ebeafccf98b9b3dc90f98e0462b2775904edec11c805ef9325c90c6)
PHP 7.0 VC14 (32 bit) (SHA256: 24afc6cc972dd2affff27c23b4284f8a7e39b485be9717f768cf0476c46ad37f)
PHP 7.0 VC14 TS (64 bit) (SHA256: 44028857e52bcdf18a3b18e647be58bccb955ab3c8a8a6644174abb9e3e82f87)
PHP 7.0 VC14 TS (32 bit) (SHA256: 276efa640a30042491fccaefe3ef76edcfb21d8766511373a1e7f855bb03b373)
PHP 7.1 VC14 (64 bit) (SHA256: 143498e9f0ef95d832137acc5788ab0c603b7b14323c2e57327c3ad699776705)
PHP 7.1 VC14 (32 bit) (SHA256: f3fbdb299f1340f5e8c0e09ed9890638c02f8cbe9986b280021e8f2be0c5c047)
PHP 7.1 VC14 TS (64 bit) (SHA256: f6603e4cbe0b9dc6323f0e9fc66f2ef3bcca558f009528749f245f6e50f1d4b4)
PHP 7.1 VC14 TS (32 bit) (SHA256: 370834f3666e7e690d876a58b9b10a416b2284681d72809c7a45a893dec19ab2)
PHP 5.6 VC11 TS (64 bit) は
「https://xdebug.org/files/php_xdebug-2.5.5-5.6-vc11-x86_64.dll」となっていますので、
「php_xdebug-2.5.5-5.6-vc11-x86_64.dll」を使う事になります。
PHP拡張ディレクトリへのインストール
インストール先はphp.iniの設定の拡張ライブラリフォルダに指定した場所へ入れます。
「c:\php\ext」などが一般的かと思いますが、
私はPHPを「C:\php-5.6.36-Win32-VC11-x64」というフォルダへ
インストールしていますので、拡張ライブラリのフォルダ設定も以下になっています。
extension_dir = "C:\php-5.6.36-Win32-VC11-x64\ext"
この「ext」フォルダに、
ダウンロードした「php_xdebug-2.5.5-5.6-vc11-x86_64.dll」を入れます。
次に、php.iniをエディタで開き、以下のように追記します。
２行目で「php_xdebug-2.5.5-5.6-vc11-x86_64.dll」を指定しています。
|
1 2 3 4 5 6 |
[XDebug] zend_extension=php_xdebug-2.5.5-5.6-vc11-x86_64.dll xdebug.remote_connect_back=On xdebug.remote_enable = 1 xdebug.remote_host = "localhost" xdebug.remote_port = 9000 |
尚、私の環境では「localhost」としてサイトにアクセスする予定はありませんが、
ドメイン環境であってもここはEclipse側のデバッグ設定で指定しますのでそのままで構いません。
以上でインストールは完了です。
Apacheを再起動してから確認します。
xdebugインストールをphpinfoで確認
xdebugインストール前のphpinfoでは以下の表示で、
「xdebug」で検索しても何も見当たりません。
This program makes use of the Zend Scripting Language Engine:
Zend Engine v2.6.0, Copyright (c) 1998-2016 Zend Technologiesphpinfoは表示できる・WordPressインストールが真っ白
xdebugを有効化した後は、以下のようになります。
This program makes use of the Zend Scripting Language Engine:
Zend Engine v2.6.0, Copyright (c) 1998-2016 Zend Technologies
with Xdebug v2.5.5, Copyright (c) 2002-2017, by Derick Rethansxdebugインストール後phpinfo・Eclipseでxdebug環境構築
また「xdebug」の項目も表示されるようになります。
xdebug項目の表示・Eclipseでxdebug環境構築
インストールはこれで完了です。
後は、Eclipse側でxdebugを利用します。
Eclipse側のデバッグ設定
たぶん、ここまでは一度は誰もがやってみたことがある所で、
いざEclipseで実行しようと思うとうまく動かず挫折するパターンなのではないかと思います。
というか私がそれでした。
というのも「環境がひとそれぞれ」だという事が問題なのだと思います。
Webサーバーに対しても、
http://127.0.0.1/でアクセスしている場合もあれば、
http://localhost/かもしれない、
http://192.168.0.2/かもしれない・・・
はたまた、http://domain.local/かもしれない。
公開ディレクトリが「C:\Apache\htdocs」かもしれないし、
「H:\hogehoge\workspace\htdocs」かもしれない。
説明が１つで定まらないことが、うまく伝わらないのだと思うのです。
私で言えば「http://aaa.hogehoge.local（例）」と、
ドメイン環境を利用して居たりするのでまた厄介だったりもします。
環境説明
実行環境のApacheやPHPのバージョンについては以下を利用しています。
これは以下の記事でご紹介してきた環境を利用しています。
- Apache2.4（x64）
- PHP：5.6（x64）
- OS:Windows8 Pro（x64)
httpd.confは以下の設定が行われている環境で検証しています。
これは初期状態のものにPHPの設定を追加したものです。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
Define SRVROOT "c:\Apache2464" ServerRoot "${SRVROOT}" Listen 80 DocumentRoot "${SRVROOT}/htdocs" <Directory "${SRVROOT}/htdocs"> Options Indexes FollowSymLinks AllowOverride None Require all granted </Directory> PHPIniDir "C:\php-5.6.36-Win32-VC11-x64/" LoadModule php5_module "C:\php-5.6.36-Win32-VC11-x64/php5apache2_4.dll" AddHandler application/x-httpd-php .php |
この段階でWeb表示は以下の状態で行えています。
Web環境の表示例・Eclipseでxdebug環境構築
ここにWordPressをインストールします。
※WordPressのデバッグ環境を構築する事を目的としています。
例として検証用URLは「127.0.0.1」にてWordPressを構成します。
以後、WordPressへのアクセスは「127.0.0.1」を採用します。
またWordPressは「wordpress」というフォルダに展開しています。
※例「C:\Apache2464\htdocs\wordpress」
-
- 127.0.0.1でWordPressインストール済・Eclipseでxdebug環境構築
-
- WordPress表示確認・Eclipseでxdebug環境構築
WordPressをドキュメントルートアクセスに変更
※この手順は一般的なWordPressサイト構成を作る為だけのもので特に必須ではありません。
WordPressの「設定」－「一般」から、
「サイトアドレス (URL)」をドメインルートに変更します。
- 変更前： http://127.0.0.1/wordpress
- 変更後： http://127.0.0.1/
WordPressサイトアドレス変更・Eclipseでxdebug環境構築
WordPressインストールディレクトリ内にある
「.htaccess」ファイルをドキュメントルートに移動します。
※無い場合は、パーマリンク設定を空保存（変更せず保存）すると作成されるはずです。
次にWordPressインストールディレクトリ内にある
「index.php」ファイルをドキュメントルートにコピーします。
index.phpをエディタで開き以下の変更を行います。
※「wordpress」はwordpressの配置を行ったフォルダ名。
- 変更前： require( dirname( __FILE__ ) . ‘/wp-blog-header.php’ );
- 変更後： require( dirname( __FILE__ ) . ‘/wordpress/wp-blog-header.php’ );
最後に、初期状態である「index.html」を「index_.html」などにリネームして潰します。
これでWordPressに対して「http://127.0.0.1/」にて、
アクセスできる環境が構築されました。
WordPressサイトアドレス変更後・Eclipseでxdebug環境構築
これでWordPress側の準備ができ、
後は子テーマを作成して変えるなり、function.phpを編集するなりしていく形になります。
Eclipse側のデバッグ設定
WordPressの環境の構築と説明が完了しましたので、
実際にEclipse側に「デバッグ構成」を行っていきます。
その前に、EclipseにWordPressの公開ディレクトリをプロジェクトとしてインポートしておき、
PHPエクスプローラに表示されている状態にしておきます。
ドキュメントルートに「index.php」コピーする前に、
既にプロジェクトとしてインポート済みの場合はリフレッシュしておき、
index.phpが一覧に表示されている状態にしておきます。
ドキュメントルートのindex.phpの反映・Eclipseでxdebug環境構築
パースペクティブをPHPにした状態から「虫（デバッグ）」アイコンの、
「▼」をクリックしてメニューを表示し、
「デバッグの構成（B)…」を選択します。
Eclipseデバッグ構成・Eclipseでxdebug環境構築
デバッグの構成ウィンドウが開きますので、
「PHP Webアプリケーション」で右クリックし、メニューから「新規」を選択します。
Webアプリケーション構成の新規作成・Eclipseでxdebug環境構築
「新規構成」が作成され、右側に設定を行っていく形です。
右側のPHPサーバー部分の「新規」をクリックしてサーバーを設定を構成します。
新規構成・Eclipseでxdebug環境構築
PHPサーバーの作成ウィンドウが開きます。
今回の検証環境の場合は以下のように設定します。
- 名前（分かりやすいもの）： server_127.0.0.1
- ベースURL（WordPressのサイトアドレス）： http://127.0.0.1
- Local Web Root（ドキュメントルート）: C:\Apache2464\htdocs
入力が完了したら「次へ」をクリックします。
PHPサーバー構成の入力・Eclipseでxdebug環境構築
サーバーパスマッピングの構成が開きます。
ここは必須ではありませんが、URLとローカルのファイルパスで、
個別に紐づける必要があるような場合に個別に設定ができるようになっています。
「追加」をクリックして設定を追加していくことができます。
サーバーパスマッピングの追加（任意）・Eclipseでxdebug環境構築
今回はサーバーの設定で行ったドキュメントルートを指定していますが、
サーバー設定と重複した内容ですので、別に不要です。
「OK」をクリックして設定を終了します。
URLとファイルパスの紐づけ・Eclipseでxdebug環境構築
サーバーが登録されプルダウン部分に表示されるようになりました。
次に「ファイル」部分の「参照」をクリックします。
サーバーの表示とファイル参照・Eclipseでxdebug環境構築
ポップアップウィンドウからドキュメントルートの「index.php」を選択します。（画像左）
「OK」をクリックするとウィンドウが閉じます。
index.php選択とURL構成・Eclipseでxdebug環境構築
ファイル部分にパスが反映されて入力されます。
「□URL自動生成」にチェックが入っていると、
下部のURLがうまく表示されていないはずですので、
チェックを外し、手動で修正を行います。
URL設定の修正・Eclipseでxdebug環境構築
このURLの指定によってWordPressが利用するドキュメントルートのindex.phpが、
デバッガに正しくマッピングされてWordPress全体のデバッグができるようになります。
次に「デバッガ」タブを選択し、デバッガーのプルダウンで「xdebug」を選択します。
「□最初の行でブレーク」をチェックしておくと、
デバッグ開始時に最初のファイル（index.php）の最初の実行行で自動停止します。
「適用」をクリックすると設定が保存されます。
デバッガ―タブのデバッガー変更・Eclipseでxdebug環境構築
デバッガの設定は以上です。
これでデバッグを開始する事ができます。
デバッグの確認
パースペクティブPHPを表示している状態で、
虫アイコン横の▼をクリックして、登録したデバッグ設定を選択します。
デバッグから選択・Eclipseでxdebug環境構築
デバッグが開始され、パースペクティブが切り替わりデバッグ画面になります。
また最初の１行目で実行が停止した状態になります。
正しくデバッグが開始されています。
また右側には変数の値などが確認できます。
最初の行でブレーク・Eclipseでxdebug環境構築
同時にブラウザが起動し、処理を待っている状態で止まっています。
ブラウザも待機表示・Eclipseでxdebug環境構築
写真ではChromeを利用してデバッグを行っていますが、
Chromeでデバッグを行うには設定が必要です。通常はここでエラーが出るはずです。
Chrome起動エラー・EclipseからChromeでデバッグ
何のことはない、Chromeの起動に失敗しただけで、
デバッガの設定の問題ではありません。
以下手順で設定を行えば、正常に起動する事ができます。
後は、ステップオーバーや、ステップインをクリックしていくと、
順次実行されていきます。
ステップインしていくと呼び出した関数の中に入っていきますが、
ステップインだけでfunction.phpまでたどり着くのはかなりステップ数があります。
事前にfunctions.phpを開き、ブレークポイントを設定しておき、
再生マークアイコンの「再開」をクリックすると一気に次のブレークポイントまで進み便利です。
ステップオーバー・Eclipseでxdebug環境構築
また多数のブレークポイントを既に設定していて、
再生マークアイコンの「再開」を押すたびにブレークポイント止まって不便な時には、
「すべてのブレークポイントをスキップ」をクリックしておくと、
一時的にブレークポイントを解除できます。
すべてのブレークポイントをスキップ・Eclipseでxdebug環境構築
実行系のボタンがすべてグレーになったところで、
プログラムの処理はすべて完了している状態になります。
実行ボタンがグレーで処理完了・Eclipseでxdebug環境構築
WordPress側も表示が完了しています。
ブラウザ表示も完了・Eclipseでxdebug環境構築
最後にデバッグの終了をクリックしてデバッグを完了します。
デバッグは都度終了・Eclipseでxdebug環境構築
デバッグを終了するとブラウザウィンドウがさらに一枚開き、
デバッグ終了画面が表示されます。
※本当はこれ消したいんですけど、今のところ消す方法が分からないです。
デバッグ終了ブラウザ表示・Eclipseでxdebug環境構築
デバッグを終了したらパースペクティブをPHPに戻します。
パースペクティブをPHPへ戻す・Eclipseでxdebug環境構築
またソースの修正を行って、またデバッグを繰り返す流れです。
ソースの編集・Eclipseでxdebug環境構築
PHPがデバッグできるって素敵っ
というか、プログラムなんだから本来デバッグできて当然と思っているのですが、
これまでずっとこのEclipseを使いながらも、
デバッグの設定をしては動かず・・・を繰り返してきました。
今までのどこが間違っていたのか？と振り返ってみると、
恐らく、記憶の限りでは・・・
WordPressの処理はすべてのURLで、
ドキュメントルートのindex.phpが処理している
この事実をなんとなく理解できていなかったのかなと思います。
元々、index.phpをデバッグしたかったわけでもないですし、
function.phpで定義したショートコードをデバッグしたかったり、
別のブログラムをデバッグしたかったりと、
index.phpを起点にデバッグ設定をした覚えがないなと思うのです。
実は答えはすごく単純なことで、
設定がちゃんとできればデバッガは簡単に使えるようになる。
これでどんなプログラムも怖がる事無く手が出せる^^
もしまだvar_dumpやらprint_r、echoを使っているようなら、
デバッグできた方が遥かに効率的にPHPが使えるようになりますよ。
尚、本記事は以下のコンテンツの一部になります。
当サイト内のコンテンツおよび画像を含むすべてにおいて、管理人アルゴリズンが著作権を保持しております。
当サイトでご紹介しております写真等につきましては著作権の放棄はしませんが、
ライセンスフリーでご利用いただいて構いません。
コンテンツを有益であると感じていただけましたら非常に光栄です。
ありがとうございます。
サイト内コンテンツを引用される際には、出典元として当サイト(個別記事)へのリンクをお願いいたします。
申し訳ございませんが、無断転載、複製をお断りさせて頂いております。
公開日：
最終更新日：2018/05/22
