Introducción

XDebug es esencial para depurar cualquier proyecto PHP. Aprende como instalar XDebug en tu servidor y como configurar PHPStorm o Visual Studio Code para depurar tu proyecto PHP con ellos.

Para mí es indispensable disponer de la posibilidad de depurar un proyecto PHP en el cual estoy trabajando. Utilizar el modo depuración en PHP nos permite ver paso a paso todo el camino que sigue el código a la vez que se puede ver que variables hay cargadas en memoria en todo momento.


Ventajas de usar XDebug en tu proyecto PHP:

  • Parar la ejecución de un proceso en cualquier parte que deseemos (con puntos de ruptura) sin necesidad de tener que usar el típico «exit», «die()» para parar la ejecución en el punto deseado (p.e: para ver «si pasa por ahí…»).
  • Esto además suele ir acompañado de un «echo», «var_dump()» o similar previo al «exit» con el objetivo de visualizar el contenido de alguna variable en concreto. Cosa que dejaría de ser necesario, ya que donde se establezca un punto de ruptura, el modo depuración te proporcionará una vista completa de todas las variables cargadas en memoria en ese momento.
  • Esto último no solo es útil para detectar errores, también lo es de cara a desarrollar nuevas funcionalidades, ya que de esta forma puedes ver de un vistazo de qué variables dispones en cierto momento así como sus valores. Con esta información a la vista puedes detectar más fácilmente si ya dispones de información que necesitas para no pedirla de nuevo a base de datos o recalcularla.

Estas ventajas y muchas otras serán las que en cuestión de unas pocas pruebas, hagan darte cuenta de lo indispensable que se volverá para ti hacer uso de esta herramienta.

Instalar XDebug en el servidor

  • Copiar todo el contenido (Ctrl+a) mostrado al ejecutar un phpinfo() del servidor.
  • Pegarlo en la caja de texto del wizard de la web oficial xdebug.org.
  • Después del análisis del wizar hay dos resultados posibles:
    • Xdebug ya instalado en el servidor (no habría que hacer nada más)
    • No instalado. En este caso os aparecerán los pasos a completar para realizar la instalación.
Ejemplo de resultado devuelto por el wizard de xdebug en caso de no detectarse instalado.

Una vez completada la instalación, reinicia el servidor. Puedes recargar la vista phpinfo() y volver a copiar su contenido en el wizard de xdebug para verificar que la instalación se ha completado correctamente.

Configurar php.ini

Ahora añade en el php.ini la siguiente configuración para activar la extensión xdebug:

[XDebug] 
xdebug.remote_enable = 1
xdebug.remote_log="c:\laragon\tmp\xdebug\xdebug.log"
xdebug.idekey="PHPSTORM"
xdebug.remote_autostart = 1 

El parámetro «xdebug.remote_log» es la ruta donde se almacenarán los logs.

Preparar navegador para depurar PHP con Xdebug

Si usas Chrome, te recomiendo la extensión Xdebug Helper y en caso de usar Firefox, el add-on The easiest Xdebug.

En cualquiera de los casos, debes dirigirte a su apartado de configuración correspondiente y configurar el IDE key for remote debugging, poniendo el mismo valor que el establecido al configurar xdebug en el php.ini, en este caso es: PHPSTORM

Configurar PHPStorm para depurar con Xdebug

Dirígete a File > Settings > Languages & Frameworks > PHP > Servers. Añade un nuevo server con los datos de tu proyecto:

Activa el modo depuración en phpstorm y en el navegador desde el plugin/add-on:

Añade un punto de ruptura en alguna linea de tu código que sepas que se ejecutará al recargar la página.

PhpStorm Xdebug debugging panel

Si ahora recargas la página, la ejecución debería pararse en el punto indicado. Como puedes apreciar, en la ventana Debug aparecen todas las variables cargadas en memoria en ese momento.

Aviso: en caso de no funcionarte correctamente, asegurate de tener la versión de PHPStorm actualizada. Se han dado muchos casos de usuarios a los que no les funcionaba esta utilidad hasta que han actualizado a una versión más reciente. También puede asegurarte de que la configuración es correcta probando a configurar el IDE Visual Studio Code para verificar que es el PHPStorm la procedencia del problema.

Configurar Xdebug en Visual Studio Code

Desde el apartado Extensiones de Visual Studio Code busca por PHP e instala PHP Debug (y opcionalmente PHP Intellisense para lograr una mejor experiencia con este lenguaje)

Finalizada la instalación de las extensiones, ubicate en la sección Debug del IDE. Selecciona dentro de este apartado el botón de configuración y elige PHP como en la siguiente captura:

Ahora configura el modo depuración. Puedes dejar la configuración que genera por defecto, que debería ser la siguiente:

{
     // 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": 9000
         }
     ]
 } 
  1. Selecciona el modo «Listen for Xdebug» y activa el modo depuración pulsando el botón «Play«.
  2. En tu navegador, activa el modo depuración mediante el plugin/add-on correspondiente en la pestaña que quieres depurar.
  3. Agrega un punto de ruptura en alguna parte de tu código
  4. Recarga la página desde tu navegador para comprobar que la ejecución se para en el punto donde has establecido el breakpoint.

Hasta aquí el post de hoy sobre como instalar XDebug y configurar PHPStorm o Visual Studio Code para depurar PHP.

Cualquier duda o problema, comentar e intentaré ayudaros en todo lo que pueda.

Un saludo!

Comparte el post