Youtube channel !

Be sure to visit my youtube channel

Friday, February 07, 2020

Docker, XDebug and VSCODE in Ubuntu

Installing XDebug under VSCode is not a very easy task, especially under the Docker environment. Here is my way of doing it. References: Docker for web developers course.



You can learn more about Docker for web development in the following course.

Here is the sample Dockerfile for creating an Apache/PHP host, enabling and then configuring xdebug:

FROM php:7.4.2-apache
RUN pecl install xdebug && docker-php-ext-enable xdebug \
# not yet in linux: xdebug.remote_host = host.docker.internal \n\
&& echo "\n\
xdebug.remote_host = 172.19.0.1 \n\
xdebug.default_enable = 1 \n\
xdebug.remote_autostart = 1 \n\
xdebug.remote_connect_back = 0 \n\
xdebug.remote_enable = 1 \n\
xdebug.remote_handler = "dbgp" \n\
xdebug.remote_port = 9000 \n\
xdebug.remote_log = /var/www/html/xdebug.log \n\
" >> /usr/local/etc/php/conf.d/docker-php-ext-xdebug.ini

here is the service allowing port 8000 to be accesed outside:
docker-compose.yaml
version: "3.7"
services:
apache_with_php:
build: .
volumes:
- ./:/var/www/html/
ports:
- "8000:80"

and here is the configuration for debug (F5) inside of VSCode:
.vscode/launch.json
{
"version": "0.2.0",
"configurations": [

{
"name": "Listen for XDebug",
"type": "php",
"request": "launch",
"port": 9000,
"pathMappings": {
"/var/www/html/": "${workspaceFolder}"
},
}
]
}

Don't forget the most important thing, to enable reverse port 9000 on the host running xdebug, in order for the container to be able to connect to this port:

sudo ufw allow in from 172.19.0.0/16 to any port 9000 comment xdebug

Then we just build and run the container
/usr/bin/docker-compose up

For debugging purposes we can enter inside the container using bash shell:
docker exec -it php-debug_apache_with_php_1 /bin/bash
in the xdebug.log file we can find useful information for the initialization of xdebug: cat xdebug.log

then just browse: http://127.0.0.1:8000/index.php, place some breakpoint inside the index.php file, press F5 and refresh the web page to see the debugger (xdebug) running.

Congratulations and enjoy the course!

4 comments:

Rajendran Thunoli said...

Thanks for your post.

Should I install "PHP Xdebug" extension in vscode for this to work?

Thank you

Anonymous said...

Cusrrent version Xdebug > 3 does not work with this Dockerfile. You need older version like

RUN pecl install xdebug-2.9.8

vinser said...

With xdebug 3.0.1 this Dockerfile works for me
-------------------------------
FROM php:7-apache
RUN pecl install xdebug && docker-php-ext-enable xdebug \
&& echo "\n\
xdebug.mode = debug \n\
xdebug.start_with_request = yes \n\
xdebug.client_host = host.docker.internal \n\
xdebug.discover_client_host = false \n\
xdebug.client_port = 9003 \n\
xdebug.log = /var/www/html/xdebug.log \n\
" >> /usr/local/etc/php/conf.d/docker-php-ext-xdebug.ini
-------------------------
I use robberphex.php-debug extension as it works with vscode v1.52.0 - can set line breakpionts when felixbecker's does not support new dreakpoints settings.
Don't forget to change 9000 port to 9002 in launch.json

Nevyan Neykov said...

@vinser
did you understand why does felixbecker's extension is not supporting setting up breakpoints ?

Subscribe To My Channel for updates

Modernizing old php project with the help of AI

0. Keep docker running in separate outside of VSCODE terminal 1. The importance of GIT for version control - create modernization branch 2. ...