Xdebug
Sommaire
Présentation
Cette page a pour objet de décrire comment interfacer PhpStorm avec Xdebug.
Documentation officielle
Plus d'informations sur l'interfaçage de PhpStorm avec Xdebug sur :
- https://www.jetbrains.com/help/phpstorm/configuring-xdebug.html
- dans le cas d'une utilisation mono-utilisateur
- https://www.jetbrains.com/help/phpstorm/multiuser-debugging-via-xdebug-proxies.htm
- dans le cas d'une utilisation multi-utilisateur (DBGp Proxy Tool)
Pré-requis
Pour pouvoir connecter PhpStorm, les pré-requis suivants doivent être respectés :
- Une clé d'IDE doit être définie
- Le serveur hébergeant Xdebug doit être joignable
- Le port d'écoute d'Xdebug doit être joignable
- Une extension de débogage doit être installé sur le navigateur de l'utilisateur
Clé d'IDE
La clé d'IDE utilisée doit être la même configurée dans PhpStorm et dans l'extension de débogage du navigateur.
Une convention veut que dans le cas d'un utilisateur unique, on indique PHPSTORM comme valeur de clé, et que dans le cas de plusieurs utilisateurs, chaque utilisateur indique une valeur permettant de l'identifier.
Dans la pratique, il vaut donc mieux, dans n'importe quel cas, d'indiquer une valeur unique correspondant à l'utilisateur.
Serveur hébergeant Xdebug
Si Xdebug est utilisé sans le proxy DBGp Proxy Tool, il faut donc simplement s'assurer que le serveur hébergeant Xdebug soit joignable depuis le poste de l'utilisateur.
Si Xdebug est utilisé avec le proxy DBGp Proxy Tool, il faut alors s'assurer que le serveur hébergeant le proxy DBGp Proxy Tool soit joignable depuis le poste de l'utilisateur.
Port d'écoute
En fonction de l'utilisation ou non du proxy DBGp Proxy Tool, le port d'écoute peut varier. Dans tous les cas, il faudra se rapprocher des personnes ayant mis en place Xdebug, ou DBGp Proxy Tool le cas échéant, pour connaître le port à utiliser.
Une convention veut que Xdebug écoute sur le port 9000, alors que DBGp Proxy Tool écoute sur le port 9001.
Pour vérifier si le port d'écoute est joignable depuis un poste Windows, utiliser telnet pour tenter de le joindre :
telnet myserver 9000
Extension de débogage
La liste des extensions de débogage est disponible sur la documentation de PhpStorm : https://www.jetbrains.com/help/phpstorm/browser-debugging-extensions.html
Il faut s'assurer que la clé d'IDE utilisée correspond bien à celle renseignée dans la configuration de l'IDE.
Mise en œuvre
PhpStorm
Aller dans File puis dans Settings... :
Une fois la fenêtre des paramètres ouverts, aller dans la section Languages & Frameworks | PHP :
S'assurer qu'un CLI Interpreter soit défini et et sélectionné, puis cliquer sur les ... à droite de la liste de ce champ :
Il est alors possible de vérifier que Xdebug est bien présent, ainsi que son numéro de version :
Fermer alors la fenêtre, retourner dans la section Languages & Frameworks | PHP et aller dans la sous-section Debug :
Le champ le plus important est le Debug port. Il faut s'assurer que ce correspond bien à celui défini par la directive xdebug.remote_port dans le fichier php.ini, soit 9000 pour la valeur par défaut
Le reste des champs est paramétrable à souhait, s'aider de la documentation de PhpStorm le cas échéant.
Fermer la fenêtre des paramètres, aller dans Tools, puis dans DBGp Proxy et enfin dans Register IDE :
Cela aura pour effet d'ouvrir la fenêtre de paramétrage de DBGp Proxy :
Renseigner ainsi les paramètres :
- IDE key
- cela correspond à la clé d'IDE évoquée plus haut
- Host
- cela correspond au serveur hébergeant Xdebug, ou DBGp Proxy le cas échéant, comme indiqué plus haut
- Port
- cela correspond au port d'écoute évoqué plus haut
En cliquant sur OK, PhpStorm établira la connexion à Xdebug. Cela se traduira sur PhpStorm par un message au travers d'une pop-up :
Ainsi qu'un message dans la fenêtre d'événements :
Du côté du serveur, on verra passer ce genre de message :
nov. 04 11:21:02 myserver.local dbgpproxy[4049]: 10:21:02.460 [info] [server] Start new client connection from 192.168.0.33:58879 nov. 04 11:21:02 myserver.local dbgpproxy[4049]: 10:21:02.460 [info] [proxyinit] [jordan] Added connection for IDE Key 'jordan': 192.168.0.33:9000 nov. 04 11:21:02 myserver.local dbgpproxy[4049]: 10:21:02.460 [info] [server] Closing client connection from 192.168.0.33:58879
Choisir l'extension de débogage appropriée sur https://www.jetbrains.com/help/phpstorm/browser-debugging-extensions.html et l'installer.
Dans le cadre de la rédaction de cette page, le navigateur Chrome sera utilisé à titre d'exemple.
Pour Xdebug pour Chrome, se rendre sur l'extension Xdebug helper et l'ajouter à Chrome en cliquant sur Ajouter à Chrome :
Une fois l'extension installée, faire un clic droit sur l'icône de l'extension et cliquer sur Options :
Une fois sur la page d'options de l'extension, repérer la section IDE key :
Dans le menu déroulant, sélectionner Other, renseigner la clé d'IDE dans le champ texte désormais modifiable et cliquer sur Save pour appliquer la configuration :
La configuration de Xdebug est terminée.
Utilisation
Se rendre sur la page web à déboguer et activer l'extension Xdebug helper en cliquant sur son icône 
.
Cela fait apparaître le menu suivant :
Cliquer sur Debug pour activer le mode Debug. L'icône devient alors verte : 
.
Côté IDE
Pour lancer l'écoute des requêtes envoyées à Xdebug au travers de la page à déboguer, aller dans Run puis cliquer sur Start Listening for PHP Debug Connections :
Ou bien cliquer simplement sur l'icône 
.
L'IDE recevra recevra désormais les requêtes de Xdebug et ce dernier bloquera le chargement de la page à chaque "breakpoint" rencontré.
