Debug PHP with Firebug and FirePHP

If you’re anything like me, you’d sooner forgo water than Firebug when working on a web project. The little ’bug is a fantastically useful HTML/CSS/JavaScript/Ajax debugger. But did you know it can also be used to debug PHP? Yes, thanks to an additional Firefox extension called FirePHP.

By combining this extension, which sits on top of Firebug, with a server-side library, your PHP scripts will be able to send debugging information to the browser, handily encoded in the HTTP response headers. Once you’re set up, you can log warnings and errors in your PHP scripts to the Firebug console, just as if you were developing JavaScript.

To start, you first need to install the FirePHP extension from Mozilla’s Firefox Add-ons site. This requires that you already have Firebug installed. Once FirePHP is installed, when you next open your Firebug panel, you’ll now see an additional blue bug. Click on that bug and a menu will appear allowing you to enable or disable FirePHP:

FirePHP Menu

This, of course, won’t do anything yet. You also need to install the FirePHP server-side library, which is available here. This is a stand-alone version of the library that can either be downloaded manually or installed using PEAR. After that, you simply need to include the library in your code. There are also versions designed to integrate with various frameworks or content management systems, such as the WP-FirePHP plugin for WordPress or the JFirePHP plugin for Joomla. For the sake of this walk-through, I’ll focus on the stand-alone functionality.

Once you have the FirePHP library on your server, you need to include it in your script with a line like:

require_once('FirePHPCore/fb.php');

Because FirePHP sends its logging data via the HTTP headers, you’ll need to buffer your script’s output so that the response headers can include content generated further down the script. In PHP, this is accomplished by calling ob_start near the top of your script:

ob_start();

With these steps done, you can start using FirePHP. All you need to do is call the fb function with whatever you’d like to log, along with an optional label and an optional constant to define the message as a standard log, a warning, an error, or information. For example:

$var = array('a'=>'pizza', 'b'=>'cookies', 'c'=>'celery');
fb($var);
fb($var, "An array");
fb($var, FirePHP::WARN);
fb($var, FirePHP::INFO);
fb($var, 'An array with an Error type', FirePHP::ERROR);

This code will produce the following output in the Firebug console:

FirePHP Console Output

You can also use FirePHP to give you a trace of your application’s execution: by passing in the FirePHP::TRACE constant, you’ll get to see the line number, class name, and function name from within which fb was called. So this code:


function hello() {
  fb('Hello World!', FirePHP::TRACE);
}
function greet() {
  hello();
}
greet();

Will produce an output as follows:

FirePHP Trace Output

This trace functionality can be fantastic for debugging more involved scripts, as it lets you know exactly from where your functions are being called.

Of course, you need to remember to remove your debugging statements before your code goes live!

There’s a lot more to FirePHP than what I’ve covered here. I’ve been showing you the simplified procedural API for FirePHP, but there’s a more advanced object-oriented API available with a number of additional features. You can learn all about it on the FirePHP site, so be sure to check it out.

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

  • Nick

    I want this for Chrome!!!

  • http://harikt.com harikt

    Nice post.
    Also great to hear and see firebug lite ;) .

  • baikis

    has anyone luck to configure nginx on ubuntu linux to have firephp working?

  • http://www.virvo.com Web-Development

    I definitely consider firebug the ultimate tool, but wasnt really a big fan of firephp, just because of the server side inclusion… but Ill be playing with it soon, it seems to be quite popular these days.

  • Louis Simoneau

    I don’t see why it would work any differently with nginx. What’s not working?

  • Matrixs

    yikes. required server side installation.. :/
    I rather use this:

    echo “”;
    print_r($msg);
    echo “”;

    =)

  • snow

    Why would this “tool” be any better or more useful than existing tools, namely php’s default error reporting mechanism?

  • Darren

    @snow, it is so much better than php’s default error reporting mechanism. For starters, the log messages/errors appear in the Firebug panel at the bottom of the page you are viewing which I find much more convenient that having another log viewer app open (and what if you can’t access the php error log remotely with that app? What if you want to see the contents of variables but not fill your log with garbage?). Secondly, hover/click on any the messages/errors and the contents appear in a popup over the page. For example, if you log an object, FirePHP will recognize that it’s an object and it’s properties will be neatly formatted and color-coded in a scrollable popup. You can expand/collapse each object or array in the popup. You really have to try it to see how convenient it is.

  • Nasko

    For debugging purposes I don’t like tools that would require me to change the source code of my application. Both Xdebug and the Zend Debugger are free and to use them you only need:

    a) a PHP extension
    b) a debugger-agnostic IDE / Editor

    I could agree though, that with FirePHP it’s possible to debug an application that’s hosted on a server which you’re not allowed to configure.

  • Codeacula

    I have to say that I believe this is a really bad idea. The type of people who would take this route to validate their PHP are also the type who would leave this code in, etc, in my opinion (which, admittedly, is based off a semi-corporate area). What’s wrong with PDT with the Zend debugger, after all? Or any of the other million debuggers? Where’s the advocating for development of your own error handling, so that you can debug without needing special packages on the server? Maybe I’m spoiled from working in PDT + having my own error-handling system that I can port about as needed.

  • رها

    Hello there and really thanks for this useful post

    I have installed firebug and firePHP on firefox 29 nightly

    But I dont have own my site that I can install FirePHP server-side library on my site and mostly I want to read php code of php site to learn more about php.
    now does it any way to see php code of other php site with this add-on whitout installing firephp server-side library ?
    if you know any way so please help me

    I really like php site and I really want to learn it and this add-on is best to learn more about php site
    please help me

    thanks you again and please forgive me for my bad English
    Sincerly
    Raha