Docker 環境で xdebug を使う方法 - php.ini, Dockerfile, launch.json の設定

VSCode と xdebug を利用してアプリケーションの実行時にコードのブレークポイントで止めることができるようなります。
デバック時にとても便利なのでやり方をメモしておきます。

検索すると xdebug2 を使う方法が出てきますが今回は xdegug3 を使う方法について書いていきます。

はじめに

手順

やる事は以下の３つです。

• php.ini に xdebug の設定を書く。
• Dockerfile に xdebug のインストール用のコマンドを書く。
• VSCode に拡張機能を追加して launch.json を作成。

フォルダ構成

以下のフォルダ構成で進めます。

┌ .vscode
│　└ launch.json
├ html
├ php
│　└ php.ini
├ docker-compose.yml
└ Dockerfile

php.ini の設定

xdebug2 と xdebug3 で書き方が異なるので注意が必要です。
xdebug3 の方が新しいのでそれを利用します。

[xdebug]
xdebug.client_host = host.docker.internal
xdebug.mode = debug
xdebug.start_with_request = yes
xdebug.discover_client_host = 0
xdebug.remote_handler = "dbgp"
xdebug.client_port = 9000

Dockerfile の作成

RUN を使うことで起動時にコマンドを実行できるので xdebug をインストールするように指定します。

FROM php:8.0-apache

RUN pecl install xdebug && \
    docker-php-ext-enable xdebug

docker-compose.yml で読み込むには build プロパティで指定すればOKです。
build にはパスを指定すれば Dockerfile という名前のファイルを読みこんでくれます。

version: "3"
services:
  web:
    build: ./
    volumes:
      - ./php//php.ini:/usr/local/etc/php/php.ini
      - ./html:/var/www/html
    ports:
      - 8080:80

VSCode で拡張機能を追加

こちらの拡張機能を追加します。

launch.json の設定

プロジェクトファイルを VSCode で開き、虫のマークをクリックするとデバックが開始されます。
port には php.iniで設定したxdebug用のport番号を指定しましょう。
pathMappings には docker のドキュメントルート: ローカルのドキュメント（フルパス） を書きます。

{
  "configurations": [
    {
      "name": "XDebug on docker",
      "type": "php",
      "request": "launch",
      "port": 9000,
      "pathMappings": {
        "/var/www/html": "/Users/○○○○/○○○○/○○○○/html"
      }
    }
  ]
}

デバックの動作チェック

ローカル環境を起動します。

docker-compose up -d

htmlフォルダは以下に test.php を作成しておきます。

<?php
echo 1;
echo 2;
echo 3;

ブラウザで localhsot:8080 を開くと「123」が表示されるはずです。

ブレークポイントを貼って虫マークから ▷ を押すとデバックを開始できます。

開始後にブラウザをリロードすれば該当箇所で止まります。

まとめ

Docker 環境で VSCode と xdebug を使ってブレークポイントで止める方法をまとめました。
こちらの記事を参考にしています。
Qiita　vscodeでxdebug3のdocker環境を作る

アプリの規模が大きくなってくると処理を追うのが大変になるので今回の方法は非常に便利ですね。

デバックでお困りの方のお役に立てると幸いです。