Sobes.tech
Middle

Wie verfolgst und überwachst du Fehler in JavaScript?

sobes.tech KI

Antwort von AI

Fehler in JavaScript überwache und monitoriere ich auf folgende Weisen:

  • Browser-Konsole: Das Hauptwerkzeug für Debugging in der Entwicklungsphase. Fehlermeldungen (synthetisch, logisch, Laufzeit) werden mit Angabe der Datei und Zeile ausgegeben.

  • try...catch-Blöcke: Erfassen Laufzeitfehler, ermöglichen deren Behandlung oder das Anzeigen zusätzlicher Informationen.

    try {
      // Code, der einen Fehler verursachen kann
      let result = riskyOperation();
    } catch (error) {
      // Fehlerbehandlung
      console.error("Es ist ein Fehler aufgetreten:", error.message);
      // Fehler an den Server senden
      sendErrorToServer(error);
    }
    
  • window.onerror: Globaler Handler für unbehandelte JavaScript-Fehler. Ermöglicht das zentrale Abfangen von Fehlern, die try...catch entgangen sind.

    window.onerror = function(message, source, lineno, colno, error) {
      console.error("Globaler Fehler:", message, source, lineno, colno);
      // Fehlerinformationen an den Server senden
      sendErrorToServer({
        message: message,
        source: source,
        lineno: lineno,
        colno: colno,
        stack: error ? error.stack : 'N/A'
      });
      return true; // Gibt true zurück, um die Standard-Fehleranzeige in der Konsole zu unterdrücken
    };
    
  • unhandledrejection-Event für Promises: Abfangen unbehandelter Fehler in Promises.

    window.addEventListener('unhandledrejection', function(event) {
      console.error('Unbehandelter Promise-Rejection:', event.reason);
      // Fehlerinformationen an den Server senden
      sendErrorToServer(event.reason);
    });
    
  • Fehlerüberwachungssysteme (Sentry, Bugsnag, Rollbar): Professionelle Dienste, die Fehler in Echtzeit sammeln, aggregieren und analysieren. Bieten Stacktraces, Informationen zur Nutzerumgebung, Fehlerhäufigkeit und Benachrichtigungen. Hauptinstrument in der Produktion.

  • Serverseitiges Logging: Fehler, die im Frontend mit try...catch, onerror oder unhandledrejection abgefangen werden, werden an den Server gesendet, um zentral gespeichert und analysiert zu werden.

Die Methode hängt von der Entwicklungsphase und der Kritikalität des Fehlers ab. In der Produktion verwende ich stets eine Kombination aus try...catch, globalen Handlern und Überwachungssystemen.