การใช้งาน XDebug เพื่อตรวจสอบการทำงานของโค้ดของ PHP บน Visual Studio Code ในกรณีที่เครื่องคอมพิวเตอร์มีโปรแกรมเว็บเซิร์ฟเวอร์ XAMPP อยู่บน Windows 10

XDebug คืออะไร

XDebug เป็นตัว Debugger ของ PHP ที่ใช้ตรวจสอบความผิดพลาดในการทำงานของโค้ด PHP ซึ่งสามารถใช้ได้กับโปรแกรม Editor โปรแกรมไหนก็ได้ที่รองรับการเขียนโปรแกรมภาษา PHP

วิธีการติดตั้ง XDebug

ขั้นตอนที่ 1

ก่อนที่จะติดตั้ง XDebug ให้ไปที่ไดเรกทอรี C:\xampp\php\ext แล้วค้นหาว่ามีไฟล์ php_xdebug.dll อยู่หรือเปล่า ถ้ามีก็จะเป็นหน้าจอดังรูป

ในกรณีนี้ ผู้ใช้จึงไม่ต้องติดตั้ง XDebug แต่ถ้าไม่มีไฟล์ php_xdebug.dll ผู้ใช้ต้องดาวน์โหลด php_xdebug.dll จากเว็บไซต์ https://xdebug.org/download.php แต่ต้องเลือกติดตั้งให้ตรงกับเวอร์ชันของ PHP ที่ใช้ในเครื่อง จากนั้นก็ให้ไปวางไว้ในไดเรกทอรี C:\xampp\php\ext

ขั้นตอนที่ 2

กำหนดค่าให้ XDebug ทำงานโดยเข้าไปที่ไฟล์ php.ini แล้วทำการแก้ไขโดยพิมพ์ข้อความดังรูป

เสร็จแล้วให้บันทึกไฟล์นี้ไว้ในชื่อเดิม

ต่อมาให้รีสตาร์ท Apache Web Server แล้วพิมพ์ https://localhost/dashboard/phpinfo.php ในช่องกรอก URL address ของเว็บบราวเซอร์ ถ้าพบ section xdebug ใน phpinfo แสดงว่า xdebug ได้ทำงานเรียบร้อยแล้ว ดังรูป

ขั้นตอนที่ 3

ไปที่โปรแกรม Visual Studio Code แล้วเลือกเมนู File -> Preferences -> Extensions แล้วค้นหา Extension ชื่อ PHP debug เมื่อพบแล้วก็ให้ติดตั้งได้เลย

ขั้นตอนที่ 4

ไปที่โปรแกรม Visual Studio Code แล้วเลือกเมนู Run -> Add Configuration… จากนั้นไปที่ช่อง Select Environment ให้เลือกเป็น PHP โปรแกรมจะเพิ่มไฟล์ launch.json ให้เองใน root directory

ขั้นตอนที่ 5

แก้ไขไฟล์ launch.json ที่สร้างขึ้นมา โดยให้แก้ไขให้มีข้อความดังนี้

เสร็จแล้วให้บันทึกไฟล์ในชื่อเดิม

ขั้นตอนที่ 6

ให้เขียนเว็บเพจ PHP ขึ้นมา 1 เพจ พอเขียนเสร็จแล้วให้ไปที่เมนู Run -> Start Debugging เพื่อทำการ Debug โค้ดที่เขียนขึ้นมา เมื่อไม่มีข้อผิดพลาดจะแสดงหน้าจอดังรูป

ต่อมาให้ไปที่เมนู Run -> Run Without Debugging เสร็จแล้วให้เลื่อนตัวชี้เมาส์ไปที่คำว่า Open In Browser ตรงด้านล่างขอจอภาพ เพื่อดูผลลัพธ์ของเว็บเพจที่เขียนไว้

ผู้เขียน

ปวรุตม์ พงศ์พฤฒานนท์
ฝ่ายระบบสารสนเทศ
สำนักคอมพิวเตอร์
pavarudh@g.swu.ac.th