2012-06-29 14 views
17

Mi proyecto que contiene muchas páginas con formularios. Este es un back-end del sistema bancario CRM, por lo que cualquier error durante el proceso de trabajo debe ser capturado e investigado. En el lado del servidor, hemos mejorado el sistema de excepciones de java, pero si ocurre un error en el lado del cliente, la única información que obtenemos ahora es una ventana de error js en IE o, a veces, una captura de pantalla de una página realizada por un usuario avanzado.Error-logging para javascript en el lado del cliente

El código de Javascript contiene extensiones de UI alimentadas por Jquery y controladores y funciones de eventos en línea codificados.

Por lo tanto, estoy preguntando si se puede utilizar algún método para capturar errores js de cualquier tipo. ¿alguna biblioteca adicional o algo que pueda darme un stacktrace como firebug en Mozilla o una consola web en Chrome?

+2

haga clic en este enlace: http://openmymind.net/2012/4/4/You-Really-Should-Log-Client-Side-Error/ –

+0

Gracias a Tamil y Alexanderb, pero en mi caso puedo ' t uso outsourcing y no se encuentra dentro de mis servicios de área de red – shershen

+0

No lo he intentado solo, pero las soluciones de este tipo pueden parecer interesantes: https://www.proxino.com/ –

Respuesta

24

Busque en window.onerror. Si desea capturar cualquier error e informarlo al servidor, entonces podría intentar una solicitud de AJAX, tal vez.

window.onerror = function(errorMessage, errorUrl, errorLine) { 
    jQuery.ajax({ 
     type: 'POST', 
     url: 'jserror.jsf', 
     data: { 
      msg: errorMessage, 
      url: errorUrl, 
      line: errorLine 
     }, 
     success: function() { 
      if (console && console.log) { 
       console.log('JS error report successful.'); 
      } 
     }, 
     error: function() { 
      if (console && console.error) { 
       console.error('JS error report submission failed!'); 
      } 
     } 
    }); 

    // Prevent firing of default error handler. 
    return true; 
} 
+7

Debe agregar una función de aceleración a esto. Si el cliente cae en un bucle que genera errores, los clientes pondrán a DOS su punto final de registro rápidamente. Mira este Repo para ver un buen ejemplo. https://github.com/TrackJs/Tech-Demo –

+0

dataType: "json" – 0fnt

+0

contentType necesita ser 'application/json' – Kildareflare

2

Si usted quiere hacer la aplicación indolora sólo hay que poner this chicos código javascript en su aplicación. Si desea implementar uno, intente con this para obtener stacktrace en windowerror y puede usar ajax para informar los errores. A nice way para rastrear los errores reportados por olark

2

http://exceptionhub.com Por el truco. http://errorception.com/ No proporciona tanta información para la depuración, pero también parece agradable.

proxino no parecen saber lo que están haciendo, que incluían un jQuery completo en su código de registrador para registrar eventos de error la última vez que lo verifiqué. No confiaría en un servicio que tiene tan poco conocimiento del JavaScript del lado del cliente para registrar mis errores de JavaScript.

+1

Vale la pena señalar que Proxino también tiene una versión jQuery-less del script, aunque todavía requiere que cargue jQuery en su página. https://www.proxino.com/documentation –

1

se recomienda utilizar el servicio de JsLog.me

Se puede capturar toda salida de la consola, además de errores y stacktraces. Lo usamos en nuestros proyectos, el registro de registro completo de la consola ayuda a nuestro equipo de control de calidad a registrar la forma de reproducción del problema. Además, funciona bien con objetos JSON grandes, como en la consola de Chrome, y tiene una búsqueda.

12

Descargo de responsabilidad: Soy CEO y creador de Sentry, un servicio de código abierto y pago que realiza informes de fallos para muchos idiomas, incluido Javascript.

Puede ser bastante difícil capturar excepciones frontend. La tecnología ha mejorado (motores JS del navegador), pero todavía hay muchas limitaciones.

  1. Necesitará un punto final de registro del lado del servidor. Esto tiene algunas complejidades, ya que es posible abusar de él (es decir, los evaluadores de PEN pueden tratar de exponer las vulnerabilidades). También necesita tratar con CORS aquí. Obviamente, recomendaría Sentry para esto, ya que somos los mejores en su clase, y si lo desea, puede alojar el servidor usted mismo (como su fuente abierta).
  2. La implementación de capturar realmente los errores en su código es bastante complicada. No puede confiar en window.onerror por varias razones (sobre todo porque los navegadores históricamente brindan información incorrecta aquí). Lo que hacemos en el cliente raven.js (que está basado en TraceKit) es parchar una serie de funciones para envolverlas en declaraciones try/catch. Por ejemplo, window.setTimeout.Con esto, podemos instalar manejadores de errores que generarán stacktraces completos en la mayoría de los navegadores.
  3. Deberá asegurarse de generar los mapas de origen para su código y de que el servidor que maneja los datos los admite. Sentry hace esto tanto raspándolos automáticamente (a través de los estándares) como permitiéndole subirlos a través de API. Sin esto, asumiendo que estás minificando el código, las cosas se vuelven casi inutilizables.
  4. El último gran problema es el ruido. La mayoría de las extensiones de navegador se inyectarán directamente en sus scripts, por lo que debe filtrar el ruido. Resolvemos esto de dos maneras: una lista negra de patrones para ignorar (es decir, "Error de script" siendo el más inútil), así como una lista blanca de dominios para aceptar (es decir, "example.com"). Hemos encontrado que la combinación de los dos es efectiva, suficiente para eliminar la mayoría del ruido aleatorio.

Algunas cosas que usted debe tener en cuenta en el servidor:

  • Los clientes a veces persisten abierta (es decir, un robot, o un mal usuario) y causar grandes cantidades de datos inútiles o viejos errores simples.
  • Su servidor debería ser capaz de manejar una cascada de estos eventos y fallar con elegancia. Sentry lo hace limitando las cosas y los datos de muestreo.
  • Las excepciones se localizan en el idioma del navegador y, sin una base de datos centralizada, se le trabará al traducirlas usted mismo (aunque en general es obvio a qué se refieren).
1

Atatus captura los errores de JavaScript y también captura las acciones del usuario que precedieron al error. Esto ayudaría a una mejor comprensión del error. Atatus le ayuda en el control de su interfaz, no sólo para los errores, sino también su rendimiento (Real supervisión de usuarios)

https://www.atatus.com/

responsabilidad: yo soy un desarrollador web en Atatus.

Cuestiones relacionadas