Skip to content

Debugging PHP in browser’s Javascript console

Debugging PHP is often done in many ways. By printing some info on the screen, using die or var_dump, using log files in which you can always write errors, warnings and similar. The bad thing is, it will destroy your layout, and it will be barely readable.

But why not using only one tool for all scripts (PHP and Javascript). As FireFox and Chrome have Javascript consoles, we can easily use them to debug PHP, too. This way you can have nice colored output, with line numbers and everything you need. The best thing is you can print arrays or even the whole object to console.

You will say that it will destroy browsers that do not use/have console, like IE. But I have taken care of that, too.

First, I will show you the class that is responsible for the whole thing:

[code lang=”php”]
class PHPDebug {

function __construct() {
if (!defined(“LOG”)) define(“LOG”,1);
if (!defined(“INFO”)) define(“INFO”,2);
if (!defined(“WARN”)) define(“WARN”,3);
if (!defined(“ERROR”)) define(“ERROR”,4);

echo ‘‘;
/// end of IE

function debug($name, $var = null, $type = LOG) {
echo ‘‘.NL;

I will not go into details about the code, as it should be understandable to medium experienced PHP programmer. Basically, this class is generating JavaScript to insert messages or variables to console. Simple as that.

The part that is dealing with IE is creating empty functions for every console function we are using, and thus IE is working despite of writing to console. Cool.

Now, how to use this class, below is code that is used on the DEMO page:
[code lang=”php”]
// include and instantiate the class
$debug = new PHPDebug();

// simple message to console
$debug->debug(“A very simple message”);

// vaiable to console
$x = 3;
$y = 5;
$z = $x/$y;
$debug->debug(“Variable Z: “, $z);

// a warnign
$debug->debug(“A simple Warning”, null, WARN);

// info
$debug->debug(“A simple Info message”, null, INFO);

// An error
$debug->debug(“A simple error messsage”, null, ERROR);

// Array in console
$fruits = array(“banana”, “apple”, “strawberry”, “pineaple”);
$fruits = array_reverse($fruits);
$debug->debug(“Fruits array”, $fruits);

// object to console
$book = new stdClass;
$book->title = “Harry Potter and the Prisoner of Azkaban”;
$book->author = “J. K. Rowling”;
$book->publisher = “Arthur A. Levine Books”;
$book->amazon_link = “”;
$debug->debug(“Object”, $book);

To see above code in action, open your console (in FireFox or Google Chrome) and go to the DEMO PAGE.

You can do the same with Internet Explorer, and the div containing message will appear, and IE will not break.

Above code is free and you can use it however you see fit.