Wednesday, April 12th, 2006

Catching users JavaScript errors in your server logs

Category: Examples

Markku Uttula admitted to coding while drunk and decided to write a little hack that captures JavaScript errors and sends them to his web server log using Ajax.

Would you want to do this? Maybe as part of a usability testing framework?

Implementation

He has one PHP file that does both the error writing, and also acts as the script src= to capture errors:

javascript

  1. window.onerror = function (msg, url, lno) {
  2.  ... ajax call back to the server log ...

Quirky.

Posted by Dion Almaer at 9:19 am
20 Comments

++++-
4.1 rating from 40 votes

20 Comments »

Comments feed TrackBack URI

Only thing I can think of is what happens if a piece of code that is polling the server every 5 seconds or whatever starts returning js errors? Your logs could get pretty big fast.

Comment by Brian — April 12, 2006

“Why would you want to do this?” You track down and fix exceptions in the server side logs, right? Why should exceptions in the client be any different? If you’re not doing this, and you didn’t test exhaustively in every possible browser version and OS, how do you know your application is actually working?

Comment by Bob Lee — April 12, 2006

window.onerror actually works again? Just as PPK, I found the event is not fired anymore.

http://www.quirksmode.org/js/events_compinfo.html

Comment by Martin — April 12, 2006

Martin, since when was it not fired? And also, what browser? Works fine for me…

Comment by José Jeria — April 12, 2006

This is pretty old technology, has been published on the web for a while and used it in a project succesfully last year to log detailed information in a database.

I did find out that using a javascript debugger like Venkman could interfere with the onerror handler.

Comment by Wilem Joosten — April 12, 2006

The test on PPK has a syntactical error which will not trigger the onerror.

For example, trying to run ‘myfunction()’ where myfunction doesn’t exist will trigger onerror. But running ‘myfunction(‘ where there’s a missing bracket will not trigger it.

Comment by Jonathan Snook — April 12, 2006

[…] Via Ajaxian, descubro esta utilidad mediante ajax en la cual su uso está más que justificado e incluso permite llegar a lugares donde la mente aun no ha llegado,(… me he pasado ). Bueno, la idea es que es muy interesante… el pie para empezar es este. […]

Pingback by aNieto2K | Lo que quiero, cuando quiero y como quiero » Gran utilidad de Ajax — April 12, 2006

Firing up an XMLHttp object to send a string one way is a bit more overhead than is necessary. Corporate no-ActiveX security policies will make it not work on IE, too. It’s pretty light and effective to use an image instead:

function logit(msg){
var i = new Image();
i.src=”logit.php?msg=” + escape(msg);
i = null;
}

logit.php doesn’t have to actually return anything.

Comment by Brent Ashley — April 12, 2006

Triggering window.onerror

Ajaxian covers a post on logging client-side errors on the server-side using AJAX. A commenter made mention of inconsistent behaviour when using the onerror event as detailed on PPK. In determining the issue, I noticed what appeared to be the…

Trackback by snook.ca - a collection of tips, tricks and bookmarks in web development — April 12, 2006

As said, I was a bit drunk (ok, I was all the way down the drunken path:) and just decided to try if I could do something usefull. This just seemed like a crazy enough idea to experiment with, and honestly I had no idea it had been done before (though I do understand that these days that’s hardly ever the case) – Espen beat me by half a year, and on his page, a comment by Patrick Corcoran was also a very interesting one (about how to achieve this *without* Ajax).

And yes, I too think using Ajax for something that’s really very trivial like this might be a bit like shooting mosquitoes with a bazooka, but hey… it sure provided me with nice pastime :)

Comment by Markku Uttula — April 12, 2006

YOU SHOULD HAVE SEARCHED THROUGH PAST ARTICLES!!!

DUPE!!!!!!!!!!!

Oh…sorry I thought I was posting on Digg.

Comment by Brian — April 12, 2006

For some reason, that never occured to me last night. Beats me how ever could that have happened – I should know better than trying to reinvent the wheel… and making it square in the process :)

Comment by Markku Uttula — April 12, 2006

Using Ajax instead of the error log of your webserver (by fetching an image for example) has it’s benefits. I logged everything from logged in user to the data entered in forms in a structured database. Using Ajax saved me the hassle of parsing the server logs, gave me a nice overview of errors and I didn’t have to wait for the server logs (my provider only makes them available every 24h)

Error-loggin isn’t trivial but crucial when you make professional software :)

Comment by Willem Joosten — April 12, 2006

I’ve set up something like this about a year ago for a web content editing/management system that i developed. If there are any javascript errors, the client e-mails me with the function that caused the error, and the username. the users are always surprised when they get a call within 10 seconds of something going awry. In some cases, the error gets fixed before they can even complain about it.
Fortunately, there aren’t many bugs and not that many users on the system, but it has helped me fix a few things.

Comment by damien — April 12, 2006

I just rechecked. Indeed, it works as expected in Firefox again. I could have sworn it did not trigger.

It is ignored by Opera, but this is because it does not implement onerror.

Well, everything is fine then :-)

Comment by Martin — April 12, 2006

log4js at http://log4js.berlios.de supports also the feature to send via AjaxAppender the errors to the server. As you can use different Layout implementations, you can define how the data is sent. Default it is sent in log4j-xml format. so you can store the logs on server and read them with a log4j-enabled reader.
You can also send the logs using the JSONLayout as JSON formatted objects.

Comment by Stephan Strittmatter — April 13, 2006

Pah – I did that in 1999 for a Microsoft extranet site :-) Nothing’s new in the world of the Internet…

Comment by RichB — April 14, 2006

What about Opera support in this logging solution?
We used this idea in our application to log errors and notify users – http://gsmsync.net
But I don’t found any way how to implement this for Opera clients.

Comment by gik — April 17, 2006

[…] Pues bien, vía Ajaxian encontramos este código: […]

Pingback by More than words » Crear logs de errores de una web mediante AJAX — April 19, 2006

We’re building a solution for this, that also does automatic try-catch insertion, so you get much more information about the errors, like callstacks in some browsers.
You can log your JavaScript errors with:
http://muscula.com

It installs by just copying a script to your HTML, just like Google Analytics. Nothng to install. (Currently in private beta)

Comment by ebdrup — December 6, 2011

Leave a comment

You must be logged in to post a comment.