Share
FirePHP est une combinaison de plug-in Firefox et de bibliothèque côté serveur qui vous permet d'envoyer toutes sortes d'informations utiles de votre application Web à votre navigateur, un peu comme la fonctionnalité console.log () avec JavaScript. Dans ce tutoriel PLUS et cette vidéo, nous allons vous apprendre à démarrer dès le début.!
Ce tutoriel comprend un screencast disponible pour les membres Tuts + Premium.
Vous pensez donc que vous êtes un excellent développeur Web, hein? Ne poursuivez pas la lecture du premier défi: répondez (honnêtement) "vrai" ou "faux" à votre propos aux affirmations suivantes:
Si vous avez répondu aux trois avec un «vrai» retentissant, donnez-vous une tape dans le dos. Je vous pardonnerai de ne pas avoir obtenu le numéro trois, mais si vous n'utilisez pas Firefox avec Firebug… où avez-vous été!?
Vous aurez besoin de cette combinaison gagnante pour compléter ce didacticiel. La dernière chose dont vous aurez besoin - pour devenir le grand maître, le grand développeur, le destructeur de code de vos rêves - est la partie la plus importante: FirePHP.
FirePHP est une combinaison de plugins Firefox et de bibliothèques côté serveur qui vous permet d’envoyer toutes sortes d’informations juteuses de votre application Web à votre navigateur, de manière plus agréable que l’habituel:
echo $ variable;
Ce code est si commun. Parfois, il semble que le moyen le plus rapide de simplement éclabousser la valeur de $ variable de sorte que vous savez ce qu'il en est à un moment donné de l'exécution du code.
Mais si $ variable n'est pas une chaîne ou un entier; Et si c'est un type de données complexe comme un tableau ou un objet? En PHP, le code ci-dessus ne serait pas très utile:
"Utilisez simplement print_r ($ variable);" Je vous entends dire. Bon pantalon smarty, mais ce n'est pas très élégant. Essayer de trouver la valeur d'un élément de tableau dans ce désordre est une douleur. Et ça ne règle toujours pas les objets!
Lorsque vous voyez ce que FirePHP peut faire, vous changez d'avis! Il transforme le débogage en un processus étonnamment agréable et donne un code beaucoup plus portable.
Dans ce didacticiel, je vais vous montrer comment configurer FirePHP dans votre application et comment l'utiliser pour accélérer le développement et le débogage..
Si l'extension FirePHP n'est pas installée, installez-la maintenant..
L'extension FirePHP (que je nommerai désormais FirePHP) est entièrement dépendante de Firebug, vous en aurez donc besoin également. Les classes côté serveur (que j'appellerai FirePHPCore) sont disponibles en tant que bibliothèque autonome. Il existe également un certain nombre de plugins pour les frameworks PHP populaires et les CMS..
Simon dit:
Bien que son nom l'indique autrement, FirePHP n'est pas réservé aux développeurs PHP. Il utilise son propre ensemble d'en-têtes HTTP pour envoyer des informations de votre application au navigateur, de sorte qu'il peut facilement être porté dans d'autres langues. Des bibliothèques côté serveur sont disponibles pour ASP, Ruby, Python, etc. S'il n'y en a pas une pour votre langue, vous pouvez toujours vous mettre au défi et écrire la vôtre.
Cela le rend également idéal pour le débogage AJAX, car cela signifie que les réponses asynchrones sont un contenu clair ne contenant que la sortie que vous voulez voir - pas le code de débogage..
Allez-y et téléchargez votre bibliothèque côté serveur préférée. Dans ce tutoriel, je vais me concentrer sur l’utilisation de la bibliothèque principale autonome. Des instructions pour configurer d’autres bibliothèques sont disponibles sur le wiki FirePHP..
Simon dit:
Si vous avez configuré PEAR et préférez l'utiliser, tapez simplement les deux lignes suivantes dans la ligne de commande:
pear channel-découvrir pear.firephp.org pear installer firephp / FirePHPCore
Une fois que vous avez décompressé le paquet, allez dans le lib dossier et copier le FirePHPCore dossier de votre serveur Web ou dossier d'inclusion d'applications.
Simon dit:
L'un des avantages du FirePHPCore autonome est son support pour PHP4. Vous pouvez même le connecter à certains de ces sites rétro que vous utilisez encore.!
Comme avec tous les bons tutoriels de codage, nous allons commencer par un exemple basique, "Hello, World" de FirePHP..
Créez un nouveau document PHP vierge. Je vais appeler le mien test.php. Enregistrez-le à la racine de votre application.
Pour que FirePHPCore fonctionne, nous devons activer la mise en mémoire tampon de sortie. Renseignez-vous davantage à ce sujet si vous ne l’avez jamais utilisé auparavant, c’est une bonne habitude à prendre quand même..
Bien entendu, nous ne devons pas oublier d’inclure la bibliothèque FirePHPCore. Si vous utilisez PHP5, ajoutez ceci en haut du fichier:
Accentsconagua
include_once ('includes / FirePHPCore / fb.php'); Si vous utilisez PHP4, incluez le fb.php4 déposer à la place.
Simon dit:
Nous n'avons pas besoin d'inclure le fichier de classe car il est inclus dans le fichier fb.php.
Nous pouvons maintenant commencer à émettre vers la console Firebug. Tapez ce qui suit après ob_start () et avant ob_end_flush ():
FB :: info ('Hello, FirePHP'); Simon dit:
FirePHPCore a une API procédurale et orientée objet. Il n'y a vraiment aucune différence entre les deux et vous pouvez utiliser celui que vous préférez.
Il utilise également le modèle singleton pour économiser de la mémoire et est livré avec une classe d’assistance complètement statique, que je préfère utiliser car elle nécessite moins de codage..
Ouvrez Firefox, démarrez Firebug et accédez à cette page. Vous devriez obtenir quelque chose comme ça:
À quel point cela est cool!? Eh bien, ce n'est pas une démo très excitante, alors essayons quelque chose d'un peu plus compliqué.
Voyons ce qui se passe lorsque nous passons dans une variable complexe. Nous allons construire un tableau et voir ce que nous obtenons. Ajoutez le code suivant juste après le dernier appel FB :: info ():
$ array ['key1'] = 'du contenu'; $ array ['anotherKey'] [] = 1234; $ array ['anotherKey'] [] = 5678; $ array ['anotherKey'] [] = 9012; $ array [] = null; FB :: info ($ array, 'My Array Test');
Maintenant, sauvegardez, allez à Firefox et actualisez.
Ok, ça a l'air bien… mais, accrochez-vous, où est la sortie? Passez votre curseur sur cette nouvelle ligne.
Sensationnel. Le cadre Firebug nous montre toutes les données de notre tableau - pas seulement les éléments de tableau de premier niveau, mais également celles de niveau inférieur - et de manière lisible et nette..
Cela devient encore plus intéressant avec des objets! FirePHPCore utilise pleinement la réflexion pour inspecter les propriétés d'un objet, même privées..
Simon dit:
FirePHPCore dispose d’un certain nombre d’options pouvant être définies pour limiter le niveau d’inspection des matrices et des objets. Vous pouvez même créer un filtre pour les propriétés d'objet que vous ne voulez pas qu'il passe à l'agent utilisateur..
Vous pouvez en savoir plus sur l'API FirePHPCore au siège de FirePHP..
Il devrait déjà être évident pour vous que cela peut aider au débogage général, mais je vais maintenant examiner quelques façons inventives d'utiliser FirePHP..
Si vous utilisez un seul contrôleur frontal pour acheminer toutes les demandes et amorcer votre application, vous pouvez indiquer le temps nécessaire au traitement de chaque demande pour votre application sur le serveur..
Quelque chose comme ça le ferait:
Gardez à l'esprit que ce n'est pas une représentation du temps de réponse, seulement temps d'exécution du code - à quelle vitesse votre serveur exécute le code avant de l'envoyer à l'agent utilisateur. La sortie doit toujours voyager de votre serveur au client via le réseau.
Simon dit:
Vous pouvez utiliser l'extension YSlow pour Firebug pour suivre le temps de chargement global des pages et la réactivité des applications..
Si vous utilisez une fonction de requête centrale ou étendez une classe de connecteur de base de données (telle que mysqli), vous pouvez envelopper une minuterie autour de toutes les requêtes synchrones et vérifier le temps qu'elles prennent..
Vous pouvez également noter les requêtes SQL elles-mêmes. En fait, vous pouvez rassembler ces deux bits de données. Et ne serait-il pas agréable d'afficher cela dans un tableau bien structuré?
Well Firebug a une structure de table et FirePHPCore a aussi un wrapper pour cela:
Simon dit:
J'ai jeté quelques extras ici. Dans le fichier myDb.class.php, si le $ résultat la variable revient faux, cela signifie que cette requête a échoué. Donc j'utilise FB :: error () signaler cela comme une erreur dans Firebug et me montrer la requête ainsi que FB :: trace () pour me montrer la pile de processus menant à la mauvaise requête.
La chose clé ici est la FB :: table () méthode. Cela rend la création d'informations de débogage structurées trop facile.
Désormais, lorsque vous instanciez votre classe myDb et exécutez une requête, les détails de cette requête apparaissent dans un tableau. Nous accéderons ensuite à ce tableau pour construire notre table FirePHP de toutes les requêtes que vous avez exécutées pour cette requête, de la durée de chacune d'elles et du temps total d'exécution de toutes les requêtes.
Ce que vous avez fait ici, avec seulement quelques lignes de code, aurait été impossible avec seulement écho. Vous ne pouviez pas espérer obtenir quelque chose d'aussi utile en si peu de temps. Cela permet un débogage rapide.
L'utilisation de FirePHPCore pour les requêtes AJAX n'est pas différente de son utilisation pour les requêtes synchrones. Utilisez simplement les fonctions normalement. Lorsque votre application effectue une demande AJAX, les informations supplémentaires de l'en-tête FirePHP sont transmises et l'extension côté client les traite dans la console de Firebug. Essayons.
Créez un nouveau fichier appelé ajax.php à la racine de votre application. Mettez le code suivant ici:
Maintenant dans votre test.php fichier, ajoutez ce qui suit après votre dernier appel FB :: info ():
