jsErrLog :: Javascript Error Logging and Reporting Tool

What is jsErrLog

If there is a javascript error on your page then your user sees it, but you don't know that there's a problem unless they contact you (more likely they simply close the browser and never come back)

jsErrLog is a self-contained service that captures the javascript error (so it doesn't scare the user) and sends the details back to the logging server so you can review (and resolve) the problem.

For Web developers you can think of it a light-weight javascript [Dr] Watson equivalent which gives you simple access to a limited set of SQM data.

jsErrLog is highly performant and is designed to fail gracefully - if there's a problem with the service it won't impact your application in any way.

Free, simple and fail-safe... and helps you deliver a better website. What more could you want?

You can find out more about jsErrLog via my blog posts or reach out via Twitter.

Integrating jsErrLog into your site

The only work you have to do is add the following code to your site:

<script type="text/javascript" src="http://jserrlog.appspot.com/jserrlog-min.js"></script>

<script type="text/javascript">

// Configure site parameters

//jsErrLog.debugMode = true;

// Optionally add additional debug information to the jsErrLog.info message field

//jsErrLog.info = "Populated the Info Message to pass to logger"

</script>

If you want the page to still throw javascript errors locally just set the debugMode to true and errors will be reported and then passed back to the browser.

At any time in your script you can update that value of the jsErrLog.info variable and that will be passed through to the report (note: it is truncated at 512 characters to protect the POST limit of 2048 characters)

If you already have your own error trapping logic that connects to the window.onerror event simply make sure it has been defined before you include the jserrlog.min.js file and after reporting the error the details will be passed to your existing handler.

If you want to see what the javascript is doing remove the -min and review jserrlog.js

If you deploy the script anywhere I'd love to know. Please get in touch with me via this blog post

Sample Errors and Viewing Reports

To see error reports from your site go to http://jserrlog.appspot.com/rpt.html and enter the top level URL (eg http://blog.offbeatmammal.com) you want to examine

But what if you don't want a report on-screen? Well, fear not. We expose an XML data feed for your reports. If you know the URL you can access it directly eg http://jserrlog.appspot.com/report.xml?sn=http://blog.offbeatmammal.com or simply click the "XML" link from the on-screen report. You can also request that the XML is formatted as RSS by adding the type=rss parameter eg http://jserrlog.appspot.com/report.xml?sn=http://blog.offbeatmammal.com&type=rss or clicking the "RSS" link from the on-screen report.

You can see samples of the types of errors trapped here and here.

Caveats

Although this is stable and in production use today there are a couple of things you should be aware of:

Because this is running on the free Google AppEngine service if the database is full or the CPU is exhausted it won't work. If I get enough folks interesting in using and supporting it I'm happy to scale accordingly but I'm not able to underwrite the service on an on-going basis. See below for details on how to donate.
As I'm trying to keep things below the free thresholds the XML and RSS feeds have specific TTLs and use memcache to only do the "expensive" queries every hour so if you're polling them you won't see instance changes. Let me know if that's a problem.
At the moment while this works as expected in IE, Firefox and Chrome (v10 and later, including ChromeOS) and Safari 5.1 and above (though this bug in webkit is still causing some problems). Opera.Next (v11.60 or v12 with Presto/2.10.229 JS engine) is now working as well (hopefully GA soon). Windows Phone 7.5 (Mango) works, though Android browser does not. If you find a browser/OS combination that works (or doesn't work) please let me know here.

The code

If you'd like copies of the javascript or back-end AppEngine scripts, or you have any comments on this please get it touch with me via this blog post. You can also find a version of it in the jsErrLog project on GitHub.

If you deploy the script anywhere I'd love to know what you're using it for and how it's helped you.

If you've found it useful would you consider supporting the service?

Thanks

The back-end code makes use of the excellent HTTPAgentParser to split out OS and Browser names and versions, and PagedQuery from He3 for pagination in the report view.

For developers who just need a simple tool for testing in Chrome, you should check out the great jsError extension.