【vscodeで xdebug 3.0 × PHP × Docker】

【ディレクトリ構造】

.docker-practice
├── html
│   └─ arraypractice.php // デバックするファイル
├── php
│   ├── Dockerfile
│   └── php.ini
└── docker-compose.yml

【最終的なコードと設定】

#####docker-compose.yml
追記 versionを2.0 -> 3.8 にした。（特に書き方は変わらず、いくつかoptionがなくなっただけ）

docker-compose.yml

version: '3.8'
services:
	php:
    　build: ./php
    　ports:
        - '80:80'
    　volumes:
        - ./html:/var/www/html
        - ./php/php.ini:/usr/local/etc/php/php.ini

---

#####phpディレクトリ内のDockerfile
( build: ./php にあたるファイル)

Dockerfile

FROM php:7.4-apache
# php.iniをdockerコンテナ内にコピって設置している
COPY php.ini /usr/local/etc/php/
# xdebugのinstallと設定に必要なzend_extensionを生成している
RUN pecl install xdebug \
  && docker-php-ext-enable xdebug
  # /usr/local/etc/php/conf.d/docker-php-ext-xdebug.iniに
  # zend_extension = ~ 出力される

---

#####php.iniにxdebug3.0の設定を追加

php.ini

[xdebug]
xdebug.mode=debug
xdebug.start_with_request = yes
; host.docker.internalはdockerのhostマシンのIPを解決してくれる。
xdebug.client_host=host.docker.internal
xdebug.client_port=9003

---

#####vscodeのlaunch.json

portはphp.iniのxdebug.client_portに合わせる
pathMappings は、'dockerコンテナ側ルートディレクトリ' : 'vscode側ルートディレクトリ'の構成

launch.json

{
 "version": "0.2.0",
 "configurations": [
     {
      "name": "Listen for XDebug",
      "type": "php",
      "request": "launch",
      "port": 9003, 
      "pathMappings": {
         "/var/www/html": "${workspaceRoot}/html"
      }
     }
 ]
}

---

#####実行
./html直下のデバッグしたいファイルにブレークポイントをつけて、
緑の三角ボタンで実行するとvscodeの下の部分がオレンジになる。
その状態で、ブラウザでreloadすればbreakpointで止まってくれて、変数なんかもVARIABLESに表示される。
（21行目ではちゃんとksort後の$arrayが表示されている。）

【こういったコードになった経緯】

１，最初はdockerコンテナに入って、pecl install xdebug でxdebugをinstallしようとしたらphpのvarsionが7.2以上にするようにエラーが出たのでDockerfileのイメージを7.0→7.4にした。

２，とりあえずphpinfo()にxdebugの項目がでるようにしたかったが、
docker-php-ext-enable xdebug で zend_extensin = ~ を作らないと表示されなかったので追加した。
また、buildしなおすたびにxdebugをinstallし直すのは面倒なのでDockerfileのRUNコマンドで実行できるようにした。

３，php.iniについては、 xdebug.start_with_request = yes がないとbreakpointで止まってくれなかった。

４，vscodeのlaunch.jsonは、pathMappingsは最初意味がわからず、
"./html" : "{workspaceRoot}" みたいにしてたが、dockerコンテナ側のルートディレクトリ : vscode側のワークスペースだとわかって変更。