views:

52

answers:

3

Is there any way to export messages logged to the javascript console in Google Chrome?

If not, can anyone suggest a good way to diagnose javascript problems on a client's machine? I have not been able to replicate the problems locally, despite setting up an identical environment.

+1  A: 

Step 1: Add a bunch of console.log statements that will help diagnose your issue

Step 2: Add logic to re-define console.log on your client's system so that it actually saves its arguments to window.log (or whatever) instead of actually logging them to the console.

window.log = []
console = console || {"log":function(x) {window.log.push(x);}}

(Note: The above will only work if your client doesn't have a console.log, ie. if they are using Firefox without Firebug, or IE. If they do, you'll need some other logic to decide whether or not to replace the console.)

Step 3: Add an onUnload handler which fires of an AJAX request to your server with the contents of window.log as one of its parameters

Step 4: Profit! ;-)

An added bonus to this system is that (once you have it setup) you can use console.log indiscriminately, and whether you're in your dev environment or your live environment it will do the correct thing.

machineghost
P.S. Not all browsers support onUnload; if your customer's doesn't, you'll probably want to trigger the AJAX calls on every console.log instead (or else use window.setInterval to "poll" window.log frequently).
machineghost
Interesting and tricky.. but looks complicated! (in particular step 3) Isn't there an easier way to do this..?
Dexter
It's really pretty simple, but just to try and show that I've added a second answer.
machineghost
A: 

You could use my JavaScript logging library, log4javascript. You will need to:

  • Set up log4javascript to send logging messages to the server using AjaxAppender (see the quick start guide, near the bottom)
  • Add logging calls to your JavaScript
  • Collect logging messages on the server using your technology of choice
Tim Down
A: 

Here's a slightly shorter/simpler version of my previous answer. To keep things easy, we'll just make an AJAX call on every log, and to keep things even easier we'll use jQuery to do the "heavy lifting". (If you use a JS library other than jQuery, it should have some sort of similar method; if not, or if you're not using a JS library ... time to seriously consider jQuery!) Oh, and we'll throw in some server-side pseudo-code to demonstrate just how easy that part of the equation is.

Step 1: Add a bunch of console.log statements that will help diagnose your issue

Step 2: Add logic to re-define console.log on your client's system so that it sends the log to your server if there is no console

var SERVER_URL = "www.yourServer.com/ajaxLogger.jsp";
var ajaxConsole = {"log":function(x) {
    $.get(SERVER_URL, {"log":x});
}}
console = console || ajaxConsole; // If there is no console, use the AJAX one

Step 3: Create a logging page on your server

The following example uses pseudo-code, since everyone has a different server-side language:

String log = pageParameters["log"];
Database.execute("INSERT INTO yourLogTable (log, date) VALUES ('" +
        dbEscape(log) +"', current date)");
machineghost