CODEWITHSUNDEEP
javascriptjqueryloggingxmlhttprequest
a paid nerd
a paid nerd

Reputation: 31512

A JavaScript frontend logging system that logs to our backend?

We have an established logging system for our server-side services. Specifically, our Django project makes heavy use of the Python logging module, so call calls to logger.info(), logger.warn() and logger.error() get picked up by our centralized logging system.

I would like an equivalent on our frontend, and I've got a few ideas:

  1. There would be some sort of custom logging object exposed via JavaScript that would send messages to backend via an XmlHttpRequest.

  2. I'd like to have equivalent logging levels on the client-side: debug, info, warning and error.

  3. When we're developing locally (debug mode), I'd like those logging messages to be logged to the browser/Firebug console via console.log().

  4. In production, debug messages should be dropped completely.

  5. I recall seeing a way to capture all uncaught JavaScript exceptions, so these should be logged at the error level.

  6. We're already using Google Analytics event tracking, and it'd be nice for whatever system we create to tie into that somehow.

Is this a good idea? How would you do this? Are there existing solutions?

(FWIW, we're using jQuery on the frontend.)

Update: Simplified question here: https://stackoverflow.com/questions/1423267/are-there-any-logging-frameworks-for-javascript

Upvotes: 14

Views: 28469

Answers (3)

wageoghe
wageoghe

Reputation: 27608

Here is another question from here on SO about this very issue.

Some recommendations are: log4js, log4javascript, and Blackbird.

FWIW, log4js was the accepted answer there. I don't have experience with any of these platforms, so I can't really recommend one over the other.

Upvotes: 2

Tim Down
Tim Down

Reputation: 324567

First, I wrote and maintain log4javascript, so I'm declaring my interest up front. I also use it every day in my work, so I have some experience of it as a user. Here's how I would deal with your questions, specifically relating to log4javascript:

  1. Use log4javascript's AjaxAppender for server logging;

  2. debug, info, warning and error are all supported, as well as trace and fatal;

  3. Use a BrowserConsoleAppender to log to FireBug or the native browser console;

  4. If you don't want to remove all debug logging calls from you production code, you can either adjust your logger's threshold (using log.setLevel(log4javascript.Level.ERROR), for example, which will suppress all log calls with priority less than ERROR). If you want to suppress all logging calls, you can drop in a stub version of log4javascript in your production code.

  5. You'll need to write a bit of code to do this using window.onerror. Something like window.onerror = function(msg, file, line) { log.error("Error in " + file + " on line " + line + ": " + msg); }

  6. I'm not sure how you want to tie in with Google Analytics. log4javascript has no particular support for it.

Upvotes: 18

Terrance
Terrance

Reputation: 11872

The idea sounds good here. Just be aware of what exactly it is you are looking to log client-side and have at it.

I would recommend using log4javascript for logging. The log4 api is pretty straight foward.

Upvotes: 2

Related Questions