Docker+PHP+VScode+Xdebugでステップ実行をする

qnote Advent Calendar 2024 の4日目です。

---

ログを仕込むのが大変、ステップ実行でリアルタイムに処理を追いたいため実装しました。試行錯誤した結果、わたしの環境ではこうやって実装できましたという備忘録です。

環境

OS: ubuntu18.04(williamyeh/ansible)

php:8.1-v4-apache

※Visual Studio Codeを使っていることを前提にしています。

Dockerfile

FROM williamyeh/ansible:ubuntu18.04

RUN apt-get update -y && \
    apt-get install -y rsync

# for Xdebug
# PECLでXdebugをインストールする
# Xdebugを有効化する
RUN pecl install xdebug \
    && docker-php-ext-enable xdebug

docker-compose.yml

version: '3'

services:
  meettech:
    platform: linux/x86_64
    image: thecodingmachine/php:8.1-v4-apache
    ports:
      - '${APP_PORT:-8080}:80'
    environment:
      PHP_EXTENSIONS: bcmath gd intl pdo_pgsql pgsql
      PHP_INI_MEMORY_LIMIT: 512M
      PHP_INI_DATE__TIMEZONE: Asia/Tokyo
      PHP_INI_MBSTRING__LANGUAGE: Japanese
      APACHE_DOCUMENT_ROOT: /var/www/html/public
    volumes:
      - '.:/var/www/html'

			# #######ここを追加#######
      # Xdebugの設定ファイルをマウント
      - type: bind
        source: ./php/docker-php-ext-xdebug.ini
        target: /etc/php/8.1/apache2/conf.d/docker-php-ext-xdebug.ini
			# #######################
    networks:
      - meettechdev
      - webdev
    extra_hosts:
      - '${VITE_HOST:-host.docker.internal}:host-gateway'

networks:
  meettechdev:
    driver: bridge
  webdev:
    external: true

docker-php-ext-xdebug.ini

./php/docker-php-ext-xdebug.iniを作成します。

[xdebug]
xdebug.mode=debug
xdebug.start_with_request=yes
xdebug.client_host=host.docker.internal
xdebug.client_port=9003
zend_extension = /usr/lib/php/20210902/xdebug.so

PHP Debug

VScodeの拡張機能からPHP Debugをインストールします。

「実行とデバッグ」から「create a launch.json file」をクリックし、PHPを選択します。

launch.json

pathMappings には docker のドキュメントルート: ローカルのドキュメント（「${workspaceRoot}」orフルパス）を書く

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

動作確認

コンテナを起動します。

# コンテナ起動
[hoge-project] $docker-compose up -d

適当な場所にブレークポイントを貼って先ほどの「実行とデバッグ」の▶️ボタンをクリックします。
⚠️デバッグ開始前に「Listen for Xdebug」が選択されていることを確認します。

デバッグ開始後に画面をリロードすると、ブレークポイントを貼った箇所で止まります。
処理を細かく追いかけたい時に便利です！

参照

詳細は以下をご参照ください。
https://zenn.dev/flyingbarbarian/articles/39b80d91144f31#php-debug