【PHP】Xdebug & VS Codeによるステップ実行

Xdebugでプログラムをステップ実行する

PHPのデバッガツール、XdebugとテキストエディタのVS Codeを組み合わせてプログラムのステップ実行を行う方法を解説。

本記事中での開発環境は、Mac OSでXAMPPやDockerなどは使わないでプリインストールのPHPとApacheで構成。

環境: Mac OS Catalina 10.15.7, Xdebug v3.1.2, PHP 8.0.13, Apache/2.4.41, Visual Studio Code 1.62.0

Xdebugをインストールする

Xdebugは標準のPHPには含まれておらず拡張機能として後から追加する必要があるため、公式サイトからライブラリファイルをダウンロードし開発環境にインストールする。

ダウンロード & インストール手順

公式サイトから以下のページを開く
https://xdebug.org/wizard

ページ内のテキスト入力欄にphpinfo関数で画面に出力した情報を全選択コピーして貼り付ける。

<?php
phpinfo();

コピーして

枠内に貼り付ける

貼り付けが出来たらページ内、左下の「Analyse my phpinfo() output」をクリックする。

ページが切り替わり、phpinfoの解析結果から環境情報とXdebug対応バージョン&インストール手順が表示される。

Instructionsで示された手順を実行
（ディレクトリやファイル名の指定などは環境によって異なるので示された情報を確認する）

画面内のxdebug-x.x.x.tgzのリンクをクリックし、圧縮ファイルをダウンロードする。

（以降はコマンドラインで操作）

圧縮ファイルを解凍
tar -xvzf xdebug-x.x.x.tgz

解凍したディレクトリ内へ移動
cd xdebug-x.x.x

コマンドを順番に実行
phpize
./configure
make

xdebugモジュール本体を指定の場所にコピーする
cp modules/xdebug.so /usr/local/lib/php/pecl/20200930

xdebug用の設定ファイルを作成する
touch /usr/local/etc/php/8.0/conf.d/99-xdebug.ini

設定ファイル内にxdebugの設定を記載する

[xdebug]
zend_extension = /usr/local/lib/php/pecl/20200930/xdebug.so
xdebug.mode = debug
xdebug.start_with_request = yes

注意
上記と同じ設定を表す以下の設定は、旧バージョンのXdebug 2までの記述方法のためXdebug3では使えない。

xdebug.remote_enable = 1 ;NG
xdebug.remote_autostart = 1 ;NG

上記の設定ファイルの作成は必須ではなく、大元の設定ファイルであるphp.iniに直接xdebugの設定を書いてもよい。
（php.iniのパスはphpinfoのLoaded Configuration Fileで確認できる）

モジュールのインストールと設定の記述が完了したら、Apacheを再起動する。
sudo apachectl restart

インストールに成功するとphpinfoにxdebug項目が追加される

Visual Studio Codeの設定

Xdebugモジュールのインストールが出来たらVS Codeから連携させてステップ実行できるようにする。

拡張機能 PHP Debug

VS CodeからXdebugを利用するためには拡張機能であるPHP Debugを追加する必要がある。

https://marketplace.visualstudio.com/items?itemName=felixfbecker.php-debug

VS Codeウィンドウ左側のExtensionsからPHP Debugを検索してインストールする。

PHP Debugのインストールが出来たら、Run and Debugをクリックする。

create a launch.json file.と書かれたリンクをクリックし、デバッグ設定ファイルlaunch.jsonを作成する。

内容は基本的に作成時のままでOK。

Xdebugをリモートで制御するためのポート番号の設定（port）をモジュール側に合わせておく必要がある。

launch.json

Xdebugモジュール設定（phpinfo）

ステップ実行

PHP Debugのインストールとlaunch.jsonの設定が完了したら、ステップデバッグを実行する。

Run and Debugのタブのまま、RUN AND DEBUGの右側の緑色の再生マークをクリック。

デバッガが待機状態となり、エディタ上にステップ実行メニューバーが表示される。

プラグラム内のステップ実行を開始したい箇所へブレークポイントを設定する。
（行数の左側をクリックし、赤丸が点灯すればOK）

webブラウザから開発環境のURLを入力し、アクセスする。
（ブレークポイントの箇所でブラウザが待機状態となる）

プログラムがブレークポイントで止まっている様子。

デバッグメニューバーの左から三番目の下向きの矢印のStep Intoをクリックし行を進める。

実行が終わった行からプログラムの変数名が設定されていることが確認出来る。

（Step Overについて）
通常のステップ実行は関数を呼び出す箇所で処理の中にも入るが、メニューの左から2番目のStep Overを選択することで関数内の処理のデバッグをスキップして次の行に進めることが出来る。

デバッグをgetMessage関数内へ進めない。（戻り値だけ取得する）

行を最後まで進めると、処理が完了しページを表示する。

メニューの一番右の停止マークをクリックするとステップ実行を終了する。

始めのRUN AND DEBUGの右側の緑色の再生マークに戻ることでステップ実行を再開出来る。

Follow me!