Get notified when JS breaks?

I have configured PHP to send me mails whenever there is an error. I would like to do the same with Javascript.

Also given the fact that this will be client side it is open to abuse.

What are good ways to get notified by mail when JS breaks in a web application?

Update:

Just to give some perspective, i usu开发者_高级运维ally load several js files including libraries (most of the time jQuery).

You can listen to the global onError event.

Note that you need to make sure it doesn't loop infinitely when it raises an error.

<script type="text/javascript">
var handlingError = false;

window.onerror = function() {
   if(handlingError) return;
   handlingError = true;

   // process error

   handlingError = false;
};
</script>

The code below relies on the global onError event, it does not require any external library and will work in any browser.

You should load it before any other script and make sure you have a server-side jserrorlogger.php script that picks up the error.

The code includes a very simple self-limiting mechanism: it will stop sending errors to the server after the 10th error. This comes in handy if your code gets stuck in a loop generating zillions of errors.

To avoid abuse you should include a similar self-limiting mechanism in your PHP code, for example by:

1. saving and updating a session variable with the error count and stop sending emails after X errors per session (while still writing them all down in your logs)
2. saving and updating a global variable with the errors-per-minute and stop sending emails when the threshold is exceeded
3. allowing only requests coming from authenticated users (applies only if your application requires authentication)
4. you name it :)

Note that to better trace javascript errors you should wrap your relevant code in try/catch blocks and possibly use the printstacktrace function found here:

https://github.com/eriwen/javascript-stacktrace

<script type="text/javascript">
  var globalOnError = (function() {
    var logErrorCount = 0;
    return function(err, url, line) {
      logErrorCount++;
      if (logErrorCount < 10) {
        var msg = "";
        if (typeof(err) === "object") { 
          if (err.message) {
            // Extract data from webkit ErrorEvent object
            url = err.filename;
            line = err.lineno;
            err = err.message;
          } else {
            // Handle strange cases where err is an object but not an ErrorEvent
            buf = "";
            for (var name in err) {
              if (err.hasOwnProperty(name)) {
                buf += name + "=" + err[name] + "&";
              }
            }
            err = "(url encoded object): " + buf;
          }
        }
        msg = "Unhandled exception ["+err+"] at line ["+line+"] url ["+url+"]";
        var sc = document.createElement('script'); sc.type = 'text/javascript';
        sc.src = 'jserrorlogger.php?msg='+encodeURIComponent(msg.substring(0, Math.min(800, msg.length)));
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(sc, s);
      }
      return false;
    }
  })();
  window.onerror = globalOnError;
</script>

You would wrap your entire program in a try/catch and send caught exceptions over AJAX to the server where an email could be generated. Short of that (and I wouldn't do that) the answer is "not really."

JA Auide has the basic idea. You could also go somewhat in between, ie.:

1. Write an AJAX "errorNotify" function that sends error details to the server so that they can be emailed to you.
2. Wrap certain parts of your code (the chunks you expect might someday have issues) with a try/catch which invokes errorNotify in the catch block.

If you were truly concerned about having 0 errors whatsoever, you'd then be stuff with try/catching your whole app, but I think just try/catching the key blocks will give you 80% of the value for 20% of the effort.

Just a note from a person that logs JavaScript errors.

• The info that comes from window.onerror is very generic. Makes debugging hard and you have no idea what caused it.
• User's plugins can also cause the issue. A very common one in certain Firebug versions was toString().
• You want to make sure that you do not flood your server with calls, limit the amount of errors that can be sent page per page load.
• Make sure to log page url with the error call, grab any other information you can too to make your life easier to debug.