Như ta đã biết, Magento là một framework khá phức tạp. Để debug trong Magento, có nhiều kĩ thuật khác nhau. Phổ biến nhất ta thường hay sử dụng kĩ thuật dump, die. Tuy nhiên, trong trường hợp luồng chạy code phức tạp, nhiều module chạy cùng, thì việc sử dụng dump die để quan sát luồng chạy sẽ gây rất nhiều thời gian. Lúc đó, việc sử dụng xdebug để debug luồng chạy là vô cùng cần thiết.
Ví dụ:
Mình cần quan sát luồng chạy tính toán của totalBaseDiscountAmount
Nếu sử dụng dump die đơn thuần, để quan sát luồng sẽ mất nhiều thời gian để dump die vào từng logic if, else
Đặt breakpoints
Thiết lập xdebug cho ta set breakpoint để quan sát luồng chạy dễ dàng, chi tiết hơn:
Các giá trị của object invoice
Giá trị sẽ lập tức được hiển thị tại điểm đặt breakpoint. Ngoài ra ta có thể quan sát luồng chạy qua từng đoạn lệnh if else.
Xdebug là một PHP extension cung cấp khả năng debug và profiling. Các thông tin có thể debug:
- stack and function traces in error messages[3] with:
- full parameter display for user defined functions
- function name, file name and line indications
- support for member functions
- memory allocation
- protection for infinite recursions
Xdebug cũng cung cấp:
- profiling information for PHP scripts
- code coverage analysis
- capabilities to debug your scripts interactively with a debugger front-end.
Các bước để sử dụng xdebug trên phpstorm và Magento. Gồm 4 bước sau:
- Install Xdebug trên Webserver
- Install extension Xdebug Helper trên Chrome
- Enable listening for Php Debug Connection
- Start debug session ở browser sử dụng xdebug helper
Tóm Tắt
Install XDebug trên Server
Sử dụng câu lệnh trên ubuntu
sudo apt install php7.4-xdebug
Cấu hình ở trong xdebug.ini . Ở đây mình sẽ viết cho Xdebug 3.x. Đối với xdebug 2.x thì cấu hình hơi khác một chút. Ở bài viết này mình xin phép sử dụng bản 3.x với php7.4 để hướng dẫn.
sudo nano /etc/php/7.4/mods-available/xdebug.ini
Cập nhật file thành nội dung sau:
zend_extension=xdebug.so
xdebug.mode=debug
xdebug.client_host=127.0.0.1
xdebug.client_port = 9003
Save cấu hình file lại. Sau đó ta cần tiến hành restart lại php7.4-fpm và apache2 service bằng các câu lệnh sau:
sudo systemctl restart php7.4-fpm
sudo systemctl restart apache2
Cấu hình CLI Interpreter và validate cấu hình xdebug
Sau khi cài đặt xong xdebug ở server, ta cần vào phpstorm kết nối thử với xdebug ở server. Chúng ta sẽ cần thực hiện các bước sau đây:
- Mở phpstorm, vào File->Settings-> PHP
Setup CLI Interpreter
ở đây ta sẽ tiến hành cấu hình CLI Interpreter
Click nút … để mở ra hộp thoại cấu hình thêm CLI Interpreter:
Click vào dấu “+” và chọn /usr/bin/php
Phpstorm sẽ tự nhận phiên bản php và phiên bản xdebug đã được cài sẵn. Ở đây trên máy mình là XDebug 3.0.4 và php 7.4.23
Sau khi chọn xong, Click OK để thêm interpreter 7.4 vào trong project hiện tại của phpstorm:
Như trên hình thì ta đã setup xong CLI interpreter.
KIểm tra connect xdebug:
Sau khi đã cài xong php interpreter, ta sẽ bắt đầu tiến hành validate. Mục đích của validate là để kiểm tra xem xdebug đã được cấu hình đúng ở server chưa.
Vào PHP->Debug ở settings phpstorm, click validate
Điền đường dẫn tới file index.php của magento. Ở đây, magento 2.4.3 file index.php nằm ở thư mục pub. Vì vậy ta trỏ tới thư mục này. Click validate để tiến hành validate. Có tích xanh ở tất cả các mục là ta đã cấu hình xdebug trên server thành công.
Nếu có báo lỗi xảy ra, bạn hãy quan sát thông báo lỗi để tìm ra hướng xử lý cho phù hợp.
Install extension Xdebug Helper trên Chrome
Bước tiếp theo ta cần cài xdebug helper. Mục đích là để kết nối tới xdebug trên phpstorm. Khi ta sử dụng web trên chrome, có gặp breakpoint ở phpstorm, thì ngay lập tức code sẽ dừng ở breakpoint đó và show ra các giá trị debug.
Cài đặt xdebug helper ở đường dẫn sau:
https://chrome.google.com/webstore/detail/xdebug-helper/eadndfjplgieldjbigjakmdgkmoaaaoc
Sau khi cài xong ta sẽ thấy hiện lên toolbar của trình duyệt như sau:
Click Debug để bật quá trình debug.
Enable listening for Php Debug Connection
Bước tiếp theo sau khi bật debug ở trình duyệt, ta cần enable connection ở phpstorm để lắng nghe từ xdebug helper.
Click biểu tượng này để bắt đầu lắng nghe dữ liệu gửi từ xdebug helper.
Bắt đầu quá trình debug.
- Đặt breakpoint ở đoạn code cần debug. Ví dụ ở 2 hàm sau:
Sử dụng chrome để sử dụng web ở tính năng cần debug. Khi luồng chạy gặp breakpoints, cửa sổ phpstorm sẽ thông báo breakpoints đã được kích hoạt, và các giá trị cần debug sẽ show lên màn hình:
Bạn có thể đặt nhiều breakpoints ở các điểm code quan trọng. Khi luồng chạy tới đoạn breakpoints, code sẽ dừng lại và show ra toàn bộ các giá trị. Các thuộc tính của object sẽ hiện ra đầy đủ. Khác với việc sử dụng dump, sử dụng xdebug sẽ không gây treo trình duyệt như ta dump một object trong magento. Ngoài ra, ta còn có thể đặt các breakpoint theo các điều kiện khác nhau để tránh việc breakpoints dừng lại quá nhiều lần.
Cảm ơn các bạn đã theo dõi 😀
