BracketsでPHPデバッグがサクサク捗る!PHP debuggerの設定方法

BracketsでPHP Debuggerの利用方法
HTMLやCSS、JavaScriptなどをはじめとしたWeb周りの言語、プログラムは、メモ帳アプリケーション1つでも作ることができます。 ...

以前ご紹介させていただいた無料で使えるコードエディタ「Brackets」。
コードエディタとしてとても優しくていい感じだなと思い、今でもよく使っています。

ただ、BracketsなどでPHPの開発をしていると、不便に思うのがデバッグの方法。
JavaScriptのデバッグは、Google Chromeなどブラウザに付属しているデベロッパーツールを使うことで非常に捗りますが、PHPのデバッグはやりずらいですよね・・・

いちいちvar_dumpやechoを使って変数の中身を出力するのも、時間もかかり手間になるばかりです。

そんなPHP開発の悩みを解決してくれるBracketsのプラグイン・拡張機能「PHP debugger」について、今回はご紹介いたします!

今回はBracketsの例でご紹介いたしますが、AtomやSublime Textなどでも、やり方は違えど導入できるようなので、ぜひ試してみてくださいね!
また、今回はXAMMPやMAMPの環境でPHPを動かす場合の事例についてご紹介していきます!

BracketsのPHP debuggerとは??

まずはPHP debuggerとは何かについて、ご紹介いたします!

BracketsのPHPdebuggerでできること

簡単にいうと、PHP debuggerを使うことで、まるでBrackets上でGoogle ChromeのデベロッパーツールにあるConsole機能やブレイクポイント機能を扱うかのごとく、PHPのデバッグができるんです!

指定したPHPファイルの行でPHPの動きを止めることで、その行の時点でPHPの各変数の中身がどうなっているのか、$_GETや$_POSTのサーバ変数の中身がどうなっているのかなど、色々な情報を確認することができます!

すごく便利ですよね!

BracketsのPHP debuggerの導入手順

それでは、BracketsのPHP debuggerの導入手順についてご紹介していきます!
手順の全体像としては、以下の通りになります!

  • (入っていない場合は)xdebugを導入
  • XAMMP(あるいはMAMP)のphp.iniファイル(PHPの設定ファイル)に必要な内容を追記
  • XAMPP(あるいはMAMP)の再起動
  • BracketsにPHP debuggerをインストール
  • PHP debuggerを表示し、PHPファイルにブレイクポイントを打ち、デバッグ作業

今回はあくまでBracketsにおける導入手順をお伝えしていますが、Atomなどでやる場合は、若干手順に違いがあるようなので、その点ご注意くださいね!

PHP debugger導入手順1:入っていない場合はPCにxdebuggerを導入

まずはxdebugというものをインストールする必要があります。

xdebugは要するに今回の内容の肝になるもの。
PHPをデバッグするための機能が、xdebugに備わっていると考えてください!

MAMPにおけるxdebug.soの場所

XAMMPやMAMPの場合は、既にxdebugの機能が備わっています!
僕のMAMP環境の場合は、上述した画像にあるように「/Applications/MAMP/bin/php/php7.1.0/lib/php/extensions/no-debug-non-zts-20160303/xdebug.so」にxdebug.soというファイルがありますが、この「xdebug.so」がない場合は、インストールしてみてくださいね!

xdebugがきちんとXAMMPやMAMPに導入できているかは、phpinfo()で確認することができます!

MAMPにおけるphpinfoの場所

XAMMPであればたいていの場合はlocalhost/xammp、MAMPであればlocalhost:8888/MAMP
をブラウザで表示させると、メニュー画面にphpinfoという項目があります。

phpinfoをクリックして繊維した次のページで、xdebugの項目があれば、無事にxdebugが導入されていることになります!

xdebugがMAMPに導入されていることを示す表示

僕のMAMP環境におけるphpinfoのページでxdebugが表示されているところをキャプチャで掲載しました!
参考にしてみてくださいね!

PHP debugger導入手順2:php.iniに必要な内容を記述

xdebugの導入ができたら、php.iniに必要な内容を記述していきます!

php.iniは、phpの基本設定を記述するファイルです。
XAMMPにもMAMPにも必ず備わっているので、php.iniを編集していきます!

php.iniファイルの場所は、XAMMPやMAMPがどのPHPのバージョンを使用しているかによって、場所が若干異なります!

mampのPHPのバージョンが確認できるところ

phpiniのファイルの場所

僕のMAMP環境の場合は、PHP7.1を使用していることが確認できたので、php.iniファイルの場所も「MAMP→bin→php→php7.1.0→conf→php.ini」にあります!

XAMMPの場合も、どのPHPのバージョンを使用しているのかを確認した上で、該当のphp.iniファイルを探してみてくださいね!

phpiniファイルを開いたところ

php.iniファイルを開いたあと、ファイルの一番下まで移動します
MAMPの場合は既に数行xdebugに関する記述がされているので、その部分をコメントアウト解除(XAMMPの場合は記述自体がされていないので特にコメントアウト解除不要)した上で、下記に掲載するコードを追記します。


[xdebug]
zend_extension="xdebug.soが置かれている場所のパス"
xdebug.idekey=idekeyの内容。phpinfoあるいはXAMPPやMAMPで立ち上げたphpファイルにphpinfo()関数を書いて調べて出てきたものを記入しました
xdebug.remote_enable=true
xdebug.remote_port=9000
xdebug.remote_autostart=1

zend_extensionのところにはxdebug.soファイルがある場所のパスを入力します。

PHP debugger導入手順3:XAMMPやMAMPの起動・再起動→PHP debuggerのインストール

ここまでできたら、XAMMPやMAMPを起動し、サーバを立ち上げます!
既に起動している場合は、XAMMPやMAMPのサーバ再起動を行います。

サーバの起動 or 再起動を行ったあとは、BracketsにPHP Debuggerをインストールします!

Bracketsの画面からプラグインアイコンを選択

BracketsのPHP debuggerの導入手順

Bracketsのプラグインの設定方法はBracketsでPHPデバッグがサクサク捗る!PHP debuggerの設定方法でもご紹介させていただいています。

簡単にいうと上述した画像に書かれている通りに進めていけば、BracketsにPHP Debuggerのプラグインは導入できます!

PHP debugger導入手順4:PHP debuggerの表示。そしてデバッグ!

PHP Debuggerのプラグインが導入できたら、PHP debuggerを表示して、実際にデバッグをしてみましょう!

PHP Debuggerは、Bracketsメニューの「表示→PHP debugger」から表示することができます。

ここから実際にPHPのデバッグを試してみます!

BracketsのPHP debuggerを試す

今回僕はMAMPのhtdocsフォルダ上に、toolsというフォルダを置き、さらにtoolsフォルダの中にlogin.phpというファイルを置きました。
そのファイルの中身が上述の画像になります。

login.phpの17行目に$testという変数を作り、そこに文字列「”test”」を代入しました。
そして、変数testの中身の確認を、19行目にブレイクポイントを打つことで、PHPファイルの読み込みを一旦止めて確認することができるようになります!

PHP Debuggerでデバッグをする時ですが、Bracketsで対応する場合、ブラウザでPHPファイルを開いた後に、URLの後ろに「?XDEBUG_SESSION_START=xdebug」をつけた状態で再度同じページにアクセスする必要があるようです。

僕の場合だと「login.php?XDEBUG_SESSION_START=xdebug」という感じですね!

xdebug.remote_autostart=1をphp.iniに設定しておけば、このパラメーターをつけなくても問題ないようです。
実際に自分の環境で試してみた結果、xdebug.remote_autostart=1をphp.iniにかいておけば問題ありませんでした。
(6/16追記)

PHP debuggerでデバッグする一連の流れ

簡潔にまとめると、

  • Bracketsで、デバッグしたいPHPファイルの中で一旦動きを止めたい行にブレイクポイント(赤い丸)をつける。
  • デバッグしたいPHPファイルをブラウザで開き、URLの末尾に?XDEBUG_SESSION_START=xdebugをつける。(6/16追記:xdebug.remote_autostart=1をphp.iniに設定していれば末尾にパラメーターつけるのは不要かもしれません)
  • 再度Bracketsを見てみると、先ほどブレイクポイントをつけた場所で一旦ファイルの読み込みが停止されているのがわかる。

以上の流れになります。
ファイルが止まっている状態でPHP Debuggerを確認すると、ブレイクポイントを打った時点でのPHPの変数の中身だったり色々な情報が見られるようになります!

ブレイクポイントは当然複数打つこともできますし、一つ先のブレイクポイントに進んでみたり、あるいは戻ってみたり、色々操作もできるので、ぜひ使い倒して慣れて見てくださいね!

まとめ

ということで、今回はBracketsでPHP Debuggerを使ってPHP開発のデバッグをサクサク行う方法についてご紹介しました!

日本語の情報が少なかった、というかほとんどなかったので、苦心してしまいましたが、無事に僕も設定がうまくいってホッとしています。
あくまで僕の環境下での設定方法をご紹介しましたので、みなさんの環境によっては多少の相違があるかもしれませんが、参考にしていただけると幸いです!

シェアする

  • このエントリーをはてなブックマークに追加

フォローする