Do pracy używam raczej Linuxa, ale jestem też fanem gier komputerowych i mam PC z Windowsem. We wcześniejszym wpisie opisałem jak można połączyć WSL2 z Dockerem i PhpStorm. Wpis się spodobał i czas na dodanie Xdebuga.
Wrzucam więc poradnik z przykładowym repozytorium: https://github.com/brtsos/xdebugwsl2
1. Ustawienie IP Linuxa
Głównym problemem z ustawieniem Xdebuga z WSL2 jest zmienne IP naszego Linuxa (Microsoft dodaje poprawkę od 2019). Xdebug z WSL2 działa tylko po podaniu tego IP (nie działa niestety flaga remote_connect_back=1, dopuszczająca wszystkie adresy IP).
Omiń ten problem za pomocą zmiennej systemowej, która zawsze będzie posiadać aktualny adres IP. Dodaj do swojego ~/.bashrc lub ~/.zshrc:
export WSLIP=$(ifconfig $(route -n | grep ^0.0.0.0 | awk '{print $NF}') | grep inet | grep -v inet6 | awk '{print $2}')
Po dodaniu zamknij terminal i otwórz ponownie lub użyj komendy:
. ~/.bashrc
2. Przygotuj pliki dockera
Użycie tej zmiennej jest proste. Najpierw dodajemy ją do pliku .docker-compose.yaml:
...
image: php:7.2-apache
build:
context: .
args:
xdebug_remote_host: ${WSLIP}
...
Następnie możemy ją przechwycić w Dockerfile. Dodatkowo skopiuj linie konfiguracyjne w zależności, jakiej wersji Xdebuga zamierzasz używać:
FROM php:7.2-apache
ARG xdebug_remote_host=127.0.0.1
## xdebug 3
RUN pecl install xdebug \
&& docker-php-ext-enable xdebug \
&& echo "xdebug.client_host=${xdebug_remote_host}" >> /usr/local/etc/php/conf.d/docker-php-ext-xdebug.ini \
&& echo "xdebug.mode=debug" >> /usr/local/etc/php/conf.d/docker-php-ext-xdebug.ini \
## xdebug 2
RUN pecl install xdebug-2.9.2 \
&& docker-php-ext-enable xdebug \
&& echo "zend_extension=/usr/local/lib/php/extensions/no-debug-non-zts-20170718/xdebug.so" >> /usr/local/etc/php/conf.d/php.ini \
&& echo 'xdebug.remote_port=9000' >> /usr/local/etc/php/conf.d/docker-php-ext-xdebug.ini \
&& echo "xdebug.remote_host=${xdebug_remote_host}" >> /usr/local/etc/php/conf.d/docker-php-ext-xdebug.ini \
&& echo 'xdebug.remote_enable=1' >> /usr/local/etc/php/conf.d/docker-php-ext-xdebug.ini \
&& echo 'xdebug.remote_connect_back=0' >> /usr/local/etc/php/conf.d/docker-php-ext-xdebug.ini
3. Zbuduj obraz dockera i uruchom go
Najpierw musisz zbuduj obraz:
docker-compose build --no-cache --force-rm --pull
Później uruchomić:
docker-compose up -d --force-recreate
Niestety musimy powtarzać te dwie komendy za każdym razem, ponieważ IP się zmienia.
4. Ustaw port w PhpStorm
Przejdź do ustawień PhpStorm. Jeżeli chcesz korzystać z Xdebuga w wersji 3 to zalecam zainstalowanie PhpStorm 2020.3. Od tej wersji oprócz standardowego portu 9000 nasłuchuje on także na porcie 9003 (ustawienie „Additionally listen on Xdebug 3 default port 9003”). Jeżeli chcesz kożystać z starszej wersji PhpStorm z Xdebug 3 to musisz zmienić ten port ręcznie. Sprawdź teraz czy wszystko wygląda w porządku (Settings | Languages & Frameworks | PHP | Debug):

5. Dodaj mapowanie katalogów
PhpStorm musi wiedzieć gdzie nasze pliki leżą w Linuksie na WSL2 więc wskarz mu te foldery (Settings | Languages & Frameworks | PHP | Servers):
- zaznacz „Use path mapping”
- dodaj ścieżki. W naszym przykładzie: „src” => „/var/www/html”

6. Zacznij debugować
Możesz już dodać pierwszy breakpoint (miejsce gdzie kod ma sie zatrzymać). W przykładowym projekcie najlepiej zaznaczyć 6 linijkę w pliku src/index.php.
Następnie należy włączyć nasłuchiwanie w PhpStorm za pomocą ikony lub (Run | Start Listening for PHP Debug Connections
).
Możesz teraz uruchomić http://app_server i włączyć debugowanie za pomocą pluginu Xdebug helper w Chrome (https://chrome.google.com/webstore/detail/xdebug-helper/eadndfjplgieldjbigjakmdgkmoaaaoc).
Więcej na temat debugowania w innych przeglądarkach: https://www.jetbrains.com/help/phpstorm/browser-debugging-extensions.html
W PhpStorm powinno się pojawić okno z zapytaniem, czy chcesz debugować kod. Potwierdź i znajdź wszystkie bugi 🙂
Nie zapomnij zapisać się na Newletter, jeżeli nie chcesz przegapić nowych wpisów i ciekawych linków ze świata PHP.