Vagrant+VSCodeでPHPをデバッグしたい

エディタをSublimeTextからVSCodeに乗り換えた。

phpのデバッグをできるようにしようと思って、設定方法を紹介しているページを巡ったのだがどうにもうまく行かない。 いろいろいじってなんとか成功したので、そのときのメモを残しておく。

環境は以下の通り

  • Windows10
  • Vagrant 2.2.15
  • CentOS 7.9
  • php 7.4
  • xdebug 3.0.4
  • VSCode 1.59.1

仮想マシンへxdebugをインストール

最初に phpinfo() を表示して $_SERVER['REMOTE_ADDR'] に入っているIPを控えておく。

vagrantの仮想マシンにログインして、remi-php74 リポジトリからxdebugをインストールする。 インストールが終わったらWebサーバ再起動。

# remi-php74リポジトリを有効に
$ sudo yum-config-manager --enable remi-php74
# xdebugをインストール
$ sudo yum install php-xdebug
# Webサーバ再起動
$ sudo systemctl restart httpd

php -v で with Xdebug と表示されればインストール成功。

[vagrant@localhost php.d]$ php -v
PHP 7.4.23 (cli) (built: Aug 24 2021 16:33:30) ( NTS )
Copyright (c) The PHP Group
Zend Engine v3.4.0, Copyright (c) Zend Technologies
    with Xdebug v3.0.4, Copyright (c) 2002-2021, by Derick Rethans

続いて xdebug の設定をする。
/etc/php.d/15-xdebug.ini を編集する。 この設定内容がxdebug Ver2系と3系でまるっきり変わっていて、最新の情報を探すのに苦労した。

$ vim /etc/php.d/15-xdebug.ini

以下の値を設定する。

xdebug.mode = debug
# ↓最初にメモした$_SERVER['REMOTE_ADDR']のIPを入れる
xdebug.client_host = 192.168.33.1
xdebug.start_with_request = yes

Ver2までの説明では以下の5行を追記しろと書かれていることが多い。

xdebug.remote_enable=1
xdebug.default_enable=0
xdebug.profiler_enable=0
xdebug.auto_trace=0
xdebug.coverage_enable=0

だがVer3では

xdebug.mode = debug

と一行書くだけで良くなった。

また xdebug.remote_host は xdebug.client_host に、 xdebug.remote_autostart は xdebug.start_with_request に名称が変更されている。

変更が終わったらWebサーバ再起動

$ sudo systemctl restart httpd

VSCodeの設定

VSCodeに拡張機能のPHP Debugをインストール。

PHP Debug - Visual Studio Marketplace
Extension for Visual Studio Code - Debug support for PHP with Xdebug
marketplace.visualstudio.com

デバッグしたいphpファイルが入っているフォルダを開く。
サイドバーのデバッグのボタンを押して、「launch.jsonファイルを作成」をクリック。 選択肢が表示されるので「PHP」を選択。

設定ファイルが開くので、ハイライトの部分を追加。
/vagrant/myworks の部分は、仮想サーバ上でのデバッグしたいphpファイルが入っているフォルダの場所を指定する。

{
    // IntelliSense を使用して利用可能な属性を学べます。
    // 既存の属性の説明をホバーして表示します。
    // 詳細情報は次を確認してください: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Listen for Xdebug",
            "type": "php",
            "request": "launch",
            "port": 9003,
            "pathMappings": {
                "/vagrant/myworks": "${workspaceRoot}"
            }
        },
....(省略)....
}

動作テストに簡単なプログラムを書いてみる。
ブレークポイントを指定するには、行の頭にマウスを持っていってクリックで赤マルがつく。

F5を押すとデバッグが開始される。
ステータスバーの色が変わったら、ブラウザからアクセスする。

→

プログラムがブレークポイントまで実行される。その後はF5を押すたびに次のブレークポイントへ進んでいく。

コメント