Foutopsporing WordPress-thema's en plug-ins met Eclipse en Xdebug

Het zuiveren van PHP met een teksteditor en een combinatie van echo, print_r en exit-oproepen is voldoende als het om eenvoudige code gaat. Wanneer uw killer WordPress-plug-in groeit naar enkele duizenden lijnen die meerdere bestanden omspannen, zal die methode snel vervelend en gevoelig voor fouten worden. Wanneer je dat punt raakt, is het tijd om over te stappen naar een debugger op afstand, zodat je snel en gemakkelijk elke regel code kunt doorlopen om problemen op te sporen.


Een debugger op afstand is een programma dat op de server is geïnstalleerd en alle werkende PHP-code onderschept. Naast andere functies heeft het de mogelijkheid om de uitvoering van de code in het midden uit te voeren en informatie door te geven aan een externe client, zoals een Integrated Development Environment (IDE). Deze tutorial behandelt hoe je de Xdebug debugger op afstand en open source Eclipse IDE samen gebruikt om WordPress-code te doorlopen om fouten op te lossen.


Stap 1 Stel uw ontwikkelomgeving in

Ik ga ervan uit dat je al Apache / PHP / MySQL hebt en een werkende WordPress-installatie op je lokale werkstation. Als dat niet het geval is, lees dan onze tutorial over het opzetten van een WordPress-ontwikkelomgeving voor Windows.

Installeer Xdebug

De meest actuele instructies zijn te vinden op de xdebug-website.

Als je Windows gebruikt met XAMPP voor ontwikkeling, is het xdebug-binaire bestand al opgenomen en kun je doorgaan met het configureren van PHP.

Als je Mac OS X gebruikt, raad ik aan om te compileren vanaf de bron of PECL te gebruiken om te installeren.

Als u Linux gebruikt, kunt u mogelijk installeren met behulp van de pakketbeheerder van uw distributie, of u kunt compileren vanaf de bron / gebruik PECL.

Configureer PHP om Xdebug te laden

U moet deze twee regels toevoegen aan uw php.ini-bestand (waar mogelijk op leeft) /etc/php.ini of c: \ xampp \ php \ php.ini of ergens anders, afhankelijk van uw platform):

 zend_extension = "/ absoluut / pad / naar / xdebug.so" xdebug.remote_enable = 1

Zodra dat is gebeurd, start u uw Apache-server opnieuw op. Er zijn veel andere opties die u later kunt configureren, die worden uitgelegd in de xdebug-documentatie, maar dat zou voldoende moeten zijn om u op weg te helpen.

Verifieer Xdebug

Maak een pagina met de naam test.php in uw webrootmap en voeg een oproep toe aan de phpinfo () -functie:

Zoek naar xdebug, en je zou een sectie onderaan de pagina moeten vinden die er als volgt uitziet:

Installeer Eclipse en PDT

Download Eclipse Classic van de downloadpagina van Eclipse, pak het uit, kopieer het naar de map met toepassingen en start het programma.

Klik op het menu Help en vervolgens op Software installeren. Selecteer de "Indigo" -site onder de optie "Werken met". Vink een van de "PHP Development Tools (PDT) Feature" aan en klik op "Next".

Klik door de resterende stappen van de wizard om de installatie te voltooien en start vervolgens Eclipse opnieuw wanneer daarom wordt gevraagd.

Stel Eclipse in om Xdebug te beluisteren

Schakel het PHP-perspectief in door op de knop Open perspectief in de rechterbovenhoek te klikken:

Selecteer vervolgens de optie "Overig", selecteer PHP en klik vervolgens op "OK":

Klik op de PHP-knop om naar het PHP-perspectief te gaan:

Ga vervolgens naar "Bestand -> Nieuw -> PHP-project." Dit zal het venster "New PHP Project" openen. U kunt "wordpress" invoeren of wat u maar wilt voor uw projectnaam. Selecteer de optie "Project maken op bestaande locatie (van bestaande bron)" onder "Inhoud" en blader naar uw WordPress-hoofddirectory. Laat de standaardinstellingen voor de andere secties en klik vervolgens op de knop "Finish".

Ga naar "Venster -> Voorkeuren -> PHP -> Debug" en verander de instelling "PHP Debugger" van Zend naar XDebug.

Ga vervolgens naar "Window -> Preferences -> PHP -> Debug -> Installed Debuggers" en dubbelklik op XDebug. Wijzig de optie "Accept remote session (JIT)" van "off" naar "localhost" en klik op "OK".

Stap 2 Foutopsporing in uw code

Breekpunten instellen

Een breekpunt is een markering die de debugger vertelt de uitvoering van een programma op een bepaalde coderegel te onderbreken, zodat u kunt inspecteren wat er aan de hand is.

Dit is makkelijk. Open gewoon het bestand met de code die u wilt inspecteren (zoals het index.php-bestand in een thema dat u aan het ontwikkelen bent). Dubbelklik vervolgens aan de linkerkant van het bestandsvenster op het grijze gebied links van de regel. Een blauwe stip zou moeten verschijnen zoals op regel 20 in het onderstaande voorbeeld (de index.php uit het thema twelfeleven).

Start een Xdebug-sessie

Nadat u een onderbrekingspunt hebt ingesteld, opent u een browser en gaat u naar uw lokale WordPress-site door de queryreeks toe te voegen XDEBUG_SESSION_START = wordpress zoals dit:

 http: // localhost / pad / naar / wordpress / XDEBUG_SESSION_START = wordpress

Dit zal xdebug vertellen om een ​​cookie in te stellen waarnaar het zal zoeken bij volgende pagina's. Als alles correct is geconfigureerd, ziet u een melding dat Eclipse een inkomende sessie heeft ontvangen. Klik op 'OK' om te accepteren en vervolgens moet de foutopsporingsweergave worden geopend op de eerste regel van index.php.

U kunt variabelen inspecteren die momenteel in scope zijn door het inspectievenster "Variabelen" aan de rechterkant te gebruiken. In het bovenstaande voorbeeld zijn er geen lokale variabelen om naar te kijken, alleen de globale variabelen $ _COOKIE, $ _ENV, $ _FILES, $ _GET, $ _POST, $ _REQUEST, $ _SERVER en $ GLOBALS.

Doorloop code

Om een ​​voorbeeld van meer bruikbare informatie te zien, moet je een paar regels code doorlopen om bij The Loop te komen. Het Eclipse "Debug" -venster heeft verschillende bedieningselementen die u moet begrijpen:

  1. Verwijder alle beëindigde lanceert - Vorige sessies wissen
  2. Hervatten - Hervat de uitvoering van de code. Als u geen andere breekpunten hebt ingesteld, wordt het programma normaal geladen.
  3. opschorten - Is niet van toepassing op PHP-foutopsporing.
  4. Beëindigen - Stop de uitvoering van het programma en debugging.
  5. Loskoppelen - Stop met debuggen, maar ga door met het uitvoeren van het programma.
  6. Stap in - Volg de code als het regel voor regel wordt uitgevoerd, inclusief naar functieaanroepen gaan. Dit is handig om een ​​bepaalde functie te debuggen.
  7. Overstappen - Sla de uitvoering van een bepaalde functieaanroep over. De uitvoering wordt hervat op de volgende regel.
  8. Stap terug - Als deze zich binnen een functie bevindt, gaat deze verder naar waar deze terugkeert.
  9. Drop To Frame - Is niet van toepassing op PHP-foutopsporing.
  10. Gebruik stapfilters - Niet ondersteund in Eclipse PDT

Klik eenmaal op de knop "Hervatten". De Eclipse-foutopsporingsclient hoort vervolgens te worden onderbroken bij het onderbrekingspunt dat u hebt ingesteld in het index.php-bestand van het thema.

Klik op de knop 'Stap in'. Hiermee gaat u naar de functie "have_posts" van WordPress. Klik nogmaals op "Stap in" en u ziet de globale $ wp_query-variabele verschijnen in het venster "Variabelen".

Klik op "Step Return" om de functie "have_posts" af te sluiten en u bevindt zich weer in het index.php-bestand. In het voorbeeld laat dit u vervolgens de "twentyeleven_content_nav" -functie aanroepen. Je kunt er in stappen om te zien wat er aan de hand is als je geïnteresseerd bent, of er overheen stappen als je dat niet bent.

Als u op "Step Over" klikt, gaat u naar de oproep naar The Loop. Als u "the_post" binnengaat, leert u veel over hoe WordPress gegevens ophaalt en naar de pagina schrijft tijdens The Loop. Houd het venster "Variabelen" in de gaten om te controleren hoe lokale en globale variabelen veranderen wanneer de functie wordt uitgevoerd.

U kunt ook op dezelfde manier door uw eigen code bladeren om te zien hoe variabelen worden gemanipuleerd terwijl de code wordt uitgevoerd.

Wanneer je alles hebt gezien dat je wilt zien, klik je op de knop Hervatten en je blog wordt zoals gebruikelijk voltooid.

Als u op een koppeling naar een andere browserpagina klikt, ziet u dat het foutopsporingsprogramma opnieuw wordt geladen, zelfs als de queryreeks van XDEBUG_SESSION_START niet aan het einde van de URL is toegevoegd.

Uw debug-sessie sluiten

Wanneer u niet langer wilt dat Eclipse de foutopsporingsmodus opent wanneer een pagina in uw lokale blog wordt geladen, voert u gewoon een URL-aanroep in die er zo uitziet in uw browser:

 http: // localhost / pad / naar / wordpress / XDEBUG_SESSION_STOP

Hiermee wordt de xdebug-cookie verwijderd en worden uw pagina's normaal geladen totdat u een andere xdebug-sessie opent.

Gebruik je Eclipse en Xdebug voor hardcore WordPress-ontwikkeling? Zo ja, heeft u aanvullende tips? Zo niet, wat weerhoudt je ervan om erin te duiken?