Trong thực tế, khi coding bằng php, anh em lập trình viên vẫn thường sử dụng var_dump, print_r hoặc dd (laravel) để in biến và gỡ lỗi. Tuy nhiên trong một số tình huống vào dự án mới mò code mà không rõ nghiệp vụ thì debugger là công cụ tuyệt vời để hỗ trợ lập trình viên gỡ lỗi. Bài viết dưới đây mình sẽ hướng dẫn các bạn sử dụng xdebug để gỡ lỗi khi lập trình bằng PHP với visual studio code.

Bước 1: kiểm tra thư mục tiện ích mở rộng

Kiểm tra cấu trúc thư mục php đang cài đặt trong máy tính, thư mục ext

Nếu đã có file php_debug.ddl như hình, nghĩa là môi trường php của bạn đã extension có xdebug. Nếu chưa có, tiến hành bước 2, nếu đã có chuyển tới bước 4

Bước 2: kiểm tra phiên bản PHP

Nếu biến PHP của bạn đã được cài đặt toàn cục, chạy lệnh sau để kiểm tra phiên bản PHP

php -v

Bước 3: Download và cài đặt xdebug

Download xdebug dựa theo phiên bản PHP của bạn

Xdebug: Downloads

Sau khi tải xong file DDL xdebug phù hợp với phiên bản PHP của bạn, copy file này vào thư mục ext (thư mục chứa các tiện ích mở rộng của PHP), đổi tên thành php_xdebug.dll

Bước 4: cấu hình tệp php.ini

Cấu hình file php.ini, thông thường file này nằm trong thư mục gốc trong thư mục php (cùng cấp file php.exe) với các tham số như sau (trong tình huống của mình là các tham số xdebug 3):

zend_extension = xdebug
[XDebug]
xdebug.mode = debug
xdebug.start_with_request = yes
xdebug.discover_client_host = 1
xdebug.show_local_vars = 1
xdebug.client_host = localhost
xdebug.client_port = 9003

Các tham số tham khảo tại đây:

https://xdebug.org/docs/upgrade_guide

Bước 5: kiểm tra xem xdebug được cài đặt chính xác chưa

Chạy lệnh php -v xem có trả ra lỗi như hình (lỗi này bắt gặp do xdebug đã cài đặt không tương thích với môi trường PHP hiện tại, cần tìm file phù hợp hơn)

Reload lại PHP hoặc môi trường server, tạo 1 file php bất kì và test 2 hàm:

php_info();
xdebug_info();

Với nội dung hàm php_info() trả ra copy nội và truy cập đường dẫn dưới, dán vào hộp nhập liệu để xdebug wizard phân tích:

Xdebug: Support — Tailored Installation Instructions

Output:

Nếu out trả ra như hình, xdebug đã được cài đặt thành công.

Bước 6: Cài đặt extesion PHP Debug cho visual studio code

Tải về extension PHP Debug của Author Xdebug

Bước 7: Cấu hình debug cho dự án.

Mở thư mục dự án cần gỡ lỗi, thao tác menu như hình

Sau khi bấm, hệ thống tự động tạo file launch.json tại thư mục gốc dự án với 3 cấu hình, mình thường sử dụng cấu hình “Listen for Xdebug” (xdebug lắng nghe luồng thao tác với dự án trên trình duyệt), hoặc “Launch currently open script” (chạy xdebug trực tiếp trên file). Lưu ý cấu hình “Listen for Xdebug” cần đảm bảo giá trị port trùng với giá trị port gán trong tham số file php.ini

{
    // 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": 9000
        },
        {
            "name": "Launch currently open script",
            "type": "php",
            "request": "launch",
            "program": "${file}",
            "cwd": "${fileDirname}",
            "port": 0,
            "runtimeExecutable": "D:\\laragon\\bin\\php\\php-8.1.10-Win32-vs16-x64\\php.exe",
            "runtimeArgs": [
                "-dxdebug.start_with_request=yes"
            ],
            "env": {
                "XDEBUG_MODE": "debug,develop",
                "XDEBUG_CONFIG": "client_port=${port}"
            }
        },
        {
            "name": "Launch Built-in web server",
            "type": "php",
            "request": "launch",
            "runtimeArgs": [
                "-dxdebug.mode=debug",
                "-dxdebug.start_with_request=yes",
                "-S",
                "localhost:0"
            ],
            "program": "",
            "cwd": "${workspaceRoot}",
            "port": 9000,
            "serverReadyAction": {
                "pattern": "Development Server \\(http://localhost:([0-9]+)\\) started",
                "uriFormat": "http://localhost:%s",
                "action": "openExternally"
            }
        }
    ]
}

Bước 8: tiến hành gỡ lỗi

Cách 1: Tùy chọn “Launch currently open script”

Tiến hành debug trực tiếp trên visual không cần sử dụng trình duyệt:

Mở dự án cần gỡ lỗi, chọn file cần gỡ lỗi và đặt break point:

Bấm F5 hoặc Run > Start Debugging

Chọn tùy chọn Launch currently open script (chạy trên kịch bản đang mở) và bấm biểu tượng play, chương trình sẽ tự động chạy file hiện tại và tìm điểm vào cho breakpoint (mình hay mở sẵn file index.php vì thường file này sẽ là điểm vào của dự án)

Cách 2: tùy chọn “Listen for Xdebug”

Bước 1: cài đặt xdebug helper extension cho trình duyệt

Xdebug helper (google.com)

Bước 2: Mở trình duyệt, và mở tiện ích xdebug, bật cho biểu tượng con bọ để chuyển trạng thái thành màu xanh (kích hoạt)

Bước 3: mở dự án bằng visual studio code, tìm file cần gỡ lỗi và đặt breakpoint

Bấm F5 hoặc Run > Start Debugging

Chọn tùy chọn “Listen for Xdebug” (lắng nghe Xdebug) và bấm biểu tượng play

Quay lại trình duyệt, truy cập dự án localhost bằng tab đang active Xdebug, visual code sẽ tự động nhận diện và chạy tới breakpoint và dừng sẵn để chúng ta bắt đầu gỡ lỗi, sử dụng các biểu tượng trên thanh công cụ debug phía trên để xác định luồng chương trình chạy và xác định line gặp lỗi, giao diện như hình:

Chúc bạn thành công !