Visual studio code php 디버깅 방법

woonizzooni

MISC

[VSCode] XDebug PHP 디버깅 환경 설정

woonizzooni 2019. 11. 12. 14:59

o 개요

  - 서버 os환경/구동환경에 따른 웹서버, php 등 설치 과정은 아래 내용에서 제외함.

  - 원격 웹서버 php 페이지를 로컬 개발 환경에서 디버깅

o [서버 > 개발pc] xdebug 설치 마법사 실행 : https://xdebug.org/wizard
   서버의 php -i 결과를 위 url에 붙여넣고 'analyse my phpinfo() output' 버튼 클릭

ex) 마법사 페이지

Visual studio code php 디버깅 방법

결과화면 예)

Visual studio code php 디버깅 방법

o [서버] xebug 모듈 설치

위 진단 결과의 instructions 내용대로 진행
(xdebug 소스 다운로드 > 빌드 > 동적 lib (*.so)파일 모듈 디렉토리에 copy)

** 빌드(컴파일) 위해서는 phpize가 설치되어 있어야 함. (ex. yum install php-devel 등), gcc, makefile등 컴파일 환경도... (c코드임) **

o [서버] php.ini 설정 && 해당 프로세스 재시작

... (마지막쯤)
[xDebug]
zend_extension = /usr/lib64/php/modules/xdebug.so
xdebug.remote_enable=true
xdebug.remote_host=개발PC IP (서버에서 내 PC가 접속가능해야 함. 도커의 경우 host.docker.internal)
xdebug.remote_port=9001
xdebug.remote_handler=dbgp

 웹 서버를

  - apache httpd 사용할 경우 httpd 재시작

  - nginx 이용의 경우 php-fpm 재시작

o [개발pc] vscode 설정

  1) PHP debug 플러그인 설치
  2) workspace 생성 or 열기
  3) Debug > Open configurations : launch.json 편집 (port확인(php.ini에 설정한), pathMappings 설정)
       ex) https://server/info.php 요청
             /remote/doc/root/info.php <--- 그 대상 (원격서버)
             ${workspaceRoot}/info.php <--- 디버깅 대상 php 파일 (내 hdd/ssd) 
        ** 각 파일을 동기화하거나 nfs등으로 공유하던가 알아서(?) 편한대로 하셈 **

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Listen for XDebug",
            "type": "php",
            "request": "launch",
            "port": 9001,
            "pathMappings": {
                "서버 doc root(ex: /remote/doc/root)" : "${workspaceRoot}"
            }
        },
        {
            "name": "Launch currently open script",
            "type": "php",
            "request": "launch",
            "program": "${file}",
            "cwd": "${fileDirname}",
            "port": 9000
        }
    ]
}

** php-storm 등 xdebug를 지원하는 ide의 경우도 port와 path경로 설정만 주의해서 설정하면 될듯 **

o [개발pc] 크롬브라우저 : Xdebug helper 설치

o [개발pc] Debug > Start Debugging & php파일 열고 break point 걸기

o [개발pc] 크롬브라우저에서 Xdebug helper를 'Debug' 모드로 변경하고 php 페이지 열기 (http://server/info.php)

o [개발pc] vscode에서 BP 확인

Visual studio code php 디버깅 방법

o 동작원리

  - vscode의 php debug모듈이 9001번 포트 서버 listen 중 (php debug플러그인)

  - 원격 웹서버가 info.php파일 요청 수신시 php.ini에 설정된 xebug 정보로(xdebug.remote_host, xdebug.remote_port)

     tcp 연결 시도 (vscode의 플러그인으로 접속) > tcp세션 연결되어 디버깅 모드 실행

   ** 서버 & 개발 pc 모두 netstat등으로 tcp 포트 조회하여 연결 상태 확인 **

ex) 순서

[서버]

nginx -c /etc/nginx/nginx.conf

php-fpm 실행 

[pc]

vscode : workspace열기 / php파일 열고 bp

크롬브라우저 : php페이지 열기

[참고]

https://marketplace.visualstudio.com/items?itemName=felixfbecker.php-debug

https://www.jetbrains.com/help/phpstorm/browser-debugging-extensions.html

https://www.nginx.com/resources/wiki/start/topics/tutorials/commandline/

---- PHP 설치 후 VS Code 설정 내용 ----

* PHP는 "D:/WebServer/PHP" 에 설치 되어 있음.

1. 기본 설정

VS Code의 PHP 설정 파일을 열어줌.

1. File -> Preferences -> Settings (단축키: Ctrl + ,)

2. Extensions의 PHP 선택

3. Edit in settings.json 선택

Visual studio code php 디버깅 방법

settings.json 에서 설치된 PHP 경로를 설정

"php.validate.enable": false,
"php.validate.executablePath": "D:/WebServer/PHP/php.exe",

php.validate.enable 을 false로 둔 이유는 PHP IntelliSense 을 설치 할텐데, 여기서 기본 내장된 기능을 끄기를 권장함.

Visual studio code php 디버깅 방법

PHP IntelliSense 설치.

2. Debuging 설정

XDebug 설치하기

1. https://xdebug.org/wizard 접속 (가이드가 주소에 나와있음)

2. cmd 창에서 "php -i" 입력하면 phpinfo 가 주루룩 나옴. 긁어다가 사이트에 복사.

3. 하단의 *Analysis my phpinfo() output *클릭

Visual studio code php 디버깅 방법

4. dll 다운 받아서 php가 설치된 폴더의 ext에 dll을 이동 ("D:\WebServer\PHP\ext")

5. php.ini 파일 젤 하단에 아래 내용 추가.(php.ini 파일은 C:\Windows 안에 넣어두었었음)

zend_extension = D:\WebServer\PHP\ext\php_xdebug-2.9.6-7.4-vc15-x86_64.dll
Visual studio code php 디버깅 방법

6. cmd 창에 "php -m" 입력하여 [PHP Modules][Zend Modules]에 Xdebug 있는지 확인

7. php.ini 파일에 아래 내용 추가.

[XDebug]  
xdebug.remote_enable = 1  
xdebug.remote_autostart = 1

8. phpinfo()에 xdebug 상태 확인

Visual studio code php 디버깅 방법
Visual studio code php 디버깅 방법

9. PHP Debug 설치

Visual studio code php 디버깅 방법

10. Debug 탭에서 "create a launch.json file" -> "PHP" 선택

Visual studio code php 디버깅 방법
Visual studio code php 디버깅 방법

11. launch.json 파일 설정 (포트는 기본 9000, 변경시 php.ini 파일에 "xdebug.remote_port = 9090" 변경시켜줘야함)

12. 디버깅시 php.exe 파일을 못찾는 에러가 떠서 각 디버깅 별로 "runtimeExecutable": "

D:/WebServer/PHP/php.exe" 추가해줌.

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Listen for XDebug",
            "type": "php",
            "runtimeExecutable": "D:/WebServer/PHP/php.exe",
            "request": "launch",
            "port": 9090
        },
        {
            "name": "Launch currently open script",
            "type": "php",
            "runtimeExecutable": "D:/WebServer/PHP/php.exe",
            "request": "launch",
            "program": "${file}",
            "cwd": "${fileDirname}",
            "port": 9090
        },
        {
            "name": "Launch Index",
            "type": "php",
            "runtimeExecutable": "D:/WebServer/PHP/php.exe",
            "request": "launch",
            "program": "${workspaceRoot}/index.php",
            "cwd": "${workspaceRoot}",
            "port": 9090
        }
    ]
}