AngularJS: serverside logging of clientside errors

Question

I've rewritten a web application using angular. But now i have the problem that it's not as easy as window.onerror = function(...) { ... } to send clientside errors to the server. But this is really helpful to detect errors.

I added a custom exception handler to angular using the following code

    $provide.decorator("$exceptionHandler", function($delegate) {
    return function(exception, cause) {
        $delegate(exception, cause);
        log2server(exception + " (" + cause + ")");
    };
});

But this wont allow me to get the location where the exception came from. Any hints/experience how to tackle this? I would also love a solution which is able to work with http://stacktracejs.com/

Answer 1

I'm currently using TraceKit which seems to work quite well.

Simply add this to your angular startup-code

$provide.decorator("$exceptionHandler", function($delegate) {
    return function(exception, cause) {
        TraceKit.report(exception);
        $delegate(exception, cause);
    };
});

+this somewhere

TraceKit.report.subscribe(function(errorReport) {
    var msg = 'msg: ' + errorReport.message + '\n\n';
    msg +="::::STACKTRACE::::\n"
    for(var i = 0; i < errorReport.stack.length; i++) {
        msg += "stack[" + i + "] " + errorReport.stack[i].url + ":" + errorReport.stack[i].line + "\n";
    }
    // log to server
    ...
}

Answer 2

We could use stacktrace.js by Eric Wendelin

1. AngularJS has good error handling.
2. stacktrace.js tries to solve important problem of getting right error information across all the browsers.

So We could create an angular wrapper around stacktrace.js which gives a comprehensive error handling.

Following are the 2 blog posts that explains very nicely, how to log client side JS error to server side using AngularJS and stacktrace.js.

1. http://engineering.talis.com/articles/client-side-error-logging/
2. http://www.bennadel.com/blog/2542-logging-client-side-errors-with-angularjs-and-stacktrace-js.htm