Rheinwerk Computing < openbook > Rheinwerk Computing - Professionelle Bücher. Auch für Einsteiger.
Professionelle Bücher. Auch für Einsteiger.

 <<   zurück
JavaScript und AJAX von Christian Wenz
Das umfassende Handbuch
Buch: JavaScript und AJAX

JavaScript und AJAX
839 S., mit DVD, 39,90 Euro
Rheinwerk Computing
ISBN 3-89842-859-1
gp Kapitel 15 Fehlerbehandlung
  gp 15.1 Fehler abfangen
    gp 15.1.1 Keine Fehlermeldung
    gp 15.1.2 Besondere Fehlermeldung
    gp 15.1.3 Ausblick: Fehlermeldungen verschicken
  gp 15.2 JavaScript Debugger
    gp 15.2.1 Wo ist der Fehler?
    gp 15.2.2 Breakpoints
    gp 15.2.3 Watches
    gp 15.2.4 Schrittweise Programmausführung

Unsere Probleme sind von Menschen gemacht, darum können sie auch von Menschen gelöst werden. – John F. Kennedy

Kapitel 15 Fehlerbehandlung

Fehlermeldungen sind der größte Feind eines Programmierers. Versierte Anwender wissen, worum es sich handelt, und der Nimbus der Unfehlbarkeit ist weg. Nicht ganz so gut informierte Benutzer jedoch wissen gar nicht, wie ihnen geschieht, wenn beispielsweise der Internet Explorer ein Warndreieck und eventuell noch eine (nichtssagende – wie immer beim IE) Fehlermeldung zeigt.

Bestenfalls treten Fehlermeldungen gar nicht auf, weil jede Eventualität berücksichtigt worden ist und die Programmierung perfekt ist. Das ist jedoch selbst bei kleineren Programmierprojekten eine Illusion und im Web erst recht. Selbst, wenn Sie keinen Fehler bei der Programmierung gemacht haben, es wird immer eine bestimmte Browserversion unter einem bestimmten Betriebssystem geben, die Ihnen einen Strich durch die Rechnung macht und unter bestimmten Umständen eine Fehlermeldung produziert.

Bereits seit der JavaScript-Version 1.2 gibt es jedoch Möglichkeiten, solche so genannten syntaktischen Fehler (Verstöße gegen die JavaScript-Syntaxregeln) abzufangen, so dass der Benutzer dadurch wenigstens nicht mehr belästigt wird oder die Fehlermeldung besonders aufbereitet wird. Denn wenn der Benutzer schon auf einen Fehler stößt, dann ist es nur zu Ihrem Vorteil, wenn auch Sie davon erfahren!

Es gibt jedoch auch logische Fehler. Das sind Fehler, die zu keiner Fehlermeldung führen, aber dafür sorgen, dass das Skript ein falsches Ergebnis liefert. Diese Fehler sind erfahrungsgemäß am schwierigsten zu finden, eben weil der Fehler nur am Ergebnis sichtbar ist. Wenn Sie den Netscape Navigator einsetzen – was in Hinblick auf die Aussagekraft der Fehlermeldungen ohnehin vorteilhaft ist –, können Sie mit einem kostenlosen Tool von Netscape dem Fehlerteufel auf die Spur kommen. Der JavaScript Debugger lässt Sie während der Ausführung eines Skripts auf die Werte der Variablen zugreifen, und Sie können den Skriptablauf auch unterbrechen.


Rheinwerk Computing

15.1 Fehler abfangen  downtop

Beim Thema Event-Handler (siehe Kapitel 14) wurde auch kurz onerror vorgestellt, der beim Eintreten eines Fehlers aktiv wird. Es gibt drei Möglichkeiten, diesen Event-Handler einzusetzen:

gp  <body onerror="Code">: Führt beim Auftreten eines Fehlers den angegebenen Code aus.
gp  window.onerror = Funktionsreferenz: Führt die angegebene Funktion beim Auftreten eines Fehlers aus. Es muss eine Referenz auf die Funktion angegeben werden, also window.onerror = funktion und nicht window.onerror = funktion(). Alternativ können Sie eine anonyme Funktion verwenden: window.onerror = function() { /* Code */ }.
gp  Eine Funktion namens onerror() wird definiert und dann automatisch ausgeführt, sobald ein Fehler auftritt.

Rheinwerk Computing

15.1.1 Keine Fehlermeldung  downtop

Wenn die Funktion, die beim Auftreten eines Fehlers ausgeführt werden soll, oder allgemein der Code, der dann zur Ausführung kommt, mit return true endet, wird der Fehler nicht angezeigt, und der Benutzer bleibt unbehelligt.

Dies soll an einem Beispiel kurz demonstriert werden. Normalerweise würde die folgende Anweisung zu einer Fehlermeldung führen, die Variable rhei ist nicht definiert. Da es jedoch eine Funktion onerror() gibt, die (immer) den Wert true zurückliefert, wird dieser Fehler verschluckt und nicht ausgegeben:

<html>
<head>
<title>Fehler abfangen</title>
<script type="text/javascript"><!--
function oe() {
   return true;
}
window.onerror = oe;

var pantha = rhei;
//--></script>
</head>
<body>
Na, wo ist der Fehler?
</body>
</html>

Rheinwerk Computing

15.1.2 Besondere Fehlermeldung  downtop

Wie bereits eingangs erwähnt wurde, kann man auch eine besondere Fehlermeldung ausgeben. An die Fehlerbehandlungsfunktion werden nämlich drei Parameter übergeben: die Fehlermeldung, die URL des Dokuments, in dem der Fehler auftrat, und die Zeile, in der das fehlerhafte Kommando steht. Mit der folgenden Strategie können Sie also eine angepasste Fehlermeldung ausgeben:

gp  Zeigen Sie eine etwas »freundlichere« Fehlermeldung für Ihre Nutzer an.
gp  Beenden Sie die Funktion mit return true, damit der Browser danach die Fehlermeldung nicht anzeigt.

Der folgende Code zeigt dies einmal exemplarisch. Der Fehler wird mittels window.alert() ausgegeben, natürlich mit einem beruhigenden Hinweis.

<html>
<head>
<title>Fehler abfangen</title>
<script type="text/javascript"><!--
function oe(meldung, url, zeile) {
   var txt = "Es ist ein Fehler aufgetreten! Das macht
      aber nichts...\n\n";
   txt += "Meldung: " + meldung + "\n";
   txt += "URL: " + url + "\n";
   txt += "Zeile: " + zeile;
   alert(txt);
   return true;
}
window.onerror = oe;
var pantha = rhei;
//--></script>
</head>
<body>

Na, wo ist der Fehler?
</body>
</html>

Abbildung
Hier klicken, um das Bild zu Vergrößern

Abbildung 15.1     Die selbst gestrickte Fehlermeldung


Rheinwerk Computing

15.1.3 Ausblick: Fehlermeldungen verschicken  toptop

Obwohl es sich bei diesem Buch um ein JavaScript-Buch handelt, ist ein Blick über den Tellerrand nicht schlecht. Am günstigsten wäre es doch, wenn eine JavaScript-Fehlermeldung dem Surfer nicht angezeigt, aber automatisch via E-Mail an den Autor der Seite (also an Sie) versandt würde.

Ein erster Ansatz ist ziemlich umständlich und nicht gerade professionell:

gp  Öffnen Sie beim Auftreten einer Fehlermeldung mit window.open() ein neues Fenster.
gp  Erstellen Sie mittels (vielen) document.write()-Anweisungen in dem neuen Fenster ein Formular, in dem Sie (z.  B.) als versteckte Formularfelder die interessanten Daten eintragen: Fehlermeldung, URL und Zeile.
gp  Setzen Sie das action-Attribut des Formulars auf mailto:Ihre_ E-Mail@Ihr-Provider.de.
gp  Fügen Sie in das Formular an geeigneter Stelle ein Kommando zum Versand des Formulars ein:
setTimeout("document.forms[0].submit(); window.close()",
   1000)
gp  Das Formular wird nun automatisch via E-Mail versandt, und das neu erschaffene Browserfenster wird gleich wieder geschlossen.

Das ist ein toller Trick – aber er hat zwei Haken. Ich habe an anderer Stelle schon darauf hingewiesen, was von action="mailto:..." in Formularen zu halten ist (kurze Antwort: nichts), und der Besucher Ihrer Website wird auch nicht gerade erfreut sein, wenn ungefragt über sein Konto eine E-Mail an Sie versandt wird. Das Hauptmanko ist jedoch, dass aus Sicherheitsgründen bei den meisten Browsern Formular.submit() nicht funktioniert, wenn action auf mailto:... gesetzt ist. Aus diesem Grund finden Sie an dieser Stelle kein komplettes Skript, sondern dürfen sich in einer Übungsaufgabe damit herumschlagen.

Mit serverseitigen Mitteln ist das dagegen kein größeres Problem. Der Mail-Versand läuft auf Ihrem Webserver ab, der Benutzer bekommt (kaum) etwas mit. Es gibt hier elegante und weniger elegante Lösungen, und Sie sehen an dieser Stelle einen Mittelweg, der auf der Grundidee des vorherigen Ansatzes aufbaut. Es wird ein neues Fenster geöffnet, in diesem Fenster wird jedoch ein serverseitiges Skript aufgerufen, das die E–Mail versendet und dann das Fenster wieder schließt.

Das Hauptproblem ist die Überlegung, welche serverseitige Programmiersprache eingesetzt wird. Ich habe mich hier für Perl, PHP und JScript.NET entschieden. Perl ist eine lang bewährte Sprache, die aber im Vergleich mit jüngeren und einfacher zu erlernenden Konkurrenten wie beispielsweise ASP.NET und eben PHP (die beiden anderen verwendeten Sprachen), mehr und mehr an Boden verliert. Doch die meisten Webserver unterstützen Perl (vor allem die meisten Hoster). Das Skript lässt sich mit relativ wenig Aufwand in andere Sprachen umschreiben.

Zunächst betrachten wir den HTML- und JavaScript-Code. Beim Auftreten eines Fehlers wird ein neues Fenster geöffnet. In der URL werden die Fehlerdaten (wie gewohnt: Meldung, URL, Zeile) übergeben. In Kapitel 9 haben Sie ja schon gesehen, wie Sie Daten in der Kommandozeile übergeben können. Von besonderer Bedeutung ist noch der Dateiname des serverseitigen Skripts. Perl-Programme liegen meistens im Verzeichnis /cgi-bin und haben die Endung .pl oder .cgi.

Sie können dieses Skript nur testen, wenn Sie Ihren Webserver entsprechend konfiguriert haben, worauf an dieser Stelle aus Platzgründen nicht eingegangen wird. Wenn Sie ein Web-Angebot bei einem Hoster unterhalten, erhalten Sie dort weitere Hinweise.

<html>
<head>
<title>Fehler abfangen</title>
<script type="text/javascript"><!--
function oe(meldung, url, zeile) {
   var perl = "/cgi-bin/fehler.pl?";
   perl += "meldung=" + escape(meldung);
      //escape() nicht vergessen!
   perl += "&url=" + escape(url);
   perl += "&zeile=" + escape(zeile);
   window.open(perl, "Fehler", "width=100,height=100");
   return true;
}
window.onerror = oe;
var panta = rhei;
//--></script>
</head>
<body>
Na, wo ist der Fehler?
</body>
</html>

Nun zur Datei fehler.pl. Dieses Skript muss die folgenden Aufgaben erledigen:

gp  die Daten aus der URL auslesen
gp  diese Daten per E-Mail verschicken
gp  ein HTML-Dokument ausgeben, das im Wesentlichen dafür sorgt, dass das Fenster wieder geschlossen wird

Das folgende Perl-Programm erledigt all diese Aufgaben. Sie müssen das Programm gegebenenfalls an Ihre Verhältnisse anpassen. Wenn Sie UNIX oder Linux einsetzen, müssen Sie in der ersten Zeile den kompletten Pfad zu Ihrem Perl-Interpreter angeben (normalerweise /usr/bin/perl, aber manchmal auch /usr/local/bin/perl oder Ähnliches). Das Programm Sendmail, das für den Versand der E-Mail sorgt, liegt in der Regel auch im Verzeichnis /usr/bin, aber auch dies kann sich ändern. Sie können auch den Hauptkonkurrenten von Sendmail, qmail, einsetzen.

#!/usr/bin/perl
$fehler = $ENV{'QUERY_STRING'};
@namevalue = split(/&/, $fehler);
foreach $i (@namevalue){
   $i =~ tr/+/ /;
   $i =~ s/%(..)/pack("C", hex($1))/eg;
   ($name, $value) = split(/=/, $i);
   $fehler{$name} = $value;
}

open(SENDMAIL, "|/usr/bin/sendmail -t");
print SENDMAIL "From: betatester\@xy.de\n";
print SENDMAIL "To: bugfixer\@xy.de\n";
print SENDMAIL "Subject: JavaScript-Fehler!\n\n";
print SENDMAIL "Fehlermeldung: " . $fehler{'meldung'}
. "\n";
print SENDMAIL "URL: " . $fehler{'url'} . "\n";
print SENDMAIL "Zeile: " . $fehler{'zeile'} . "\n";
close SENDMAIL;
print <<'EOF';
<html>
<head>
<title>Fehler entdeckt!</title>
<script type="text/javascript"><!--
window.close();
//--></script>
</head>
<body>Einen Moment bitte ...</body>
</html>
EOF

Tritt nun ein JavaScript-Fehler auf, so öffnet sich für kurze Zeit das neue Browserfenster, eine E-Mail wird versandt, und das Fenster wird wieder geschlossen. So einfach ist das (mehr oder weniger)!

Die PHP-Version kann in etwa wie folgt aussehen:

<?php
$meldung = (isset($_GET['meldung'])) ? $_GET['meldung'] : '';
$url = (isset($_GET['url'])) ? $_GET['url'] : '';
$zeile = (isset($_GET['zeile'])) ? $_GET['zeile'] : '';
$mailtext  = "Fehlermeldung: $meldung\n";
$mailtext .= "URL: $url\n";
$mailtext .= "Zeile: $zeile\n";
mail("bugfixer@xy.de", "JavaScript-Fehler!",
$mailtext, "");
?>
<html>
<head>
<title>Fehler entdeckt!</title>
<script type="text/javascript"><!--
  window.close();
//--></script>
</head>
<body>Einen Moment bitte ...</body>
</html>

Die Datei muss die Endung .php haben, und der Webserver muss natürlich für die Unterstützung von PHP korrekt konfiguriert sein!

Zu guter Letzt folgt hier noch die ASP.NET-Seite auf Basis von JScript .NET:

<%@ Page Language="JScript" %>
<%@ Import Namespace="System.Web.Mail" %>
<script runat="server">
function Page_Load() {
  SmtpMail.SmtpServer = "localhost";
  SmtpMail.Send(
    "besucher@xy.de",
    "bugfixer@xy.de",
    "JavaScript-Fehler!",
    "Fehlermeldung: " + Request.QueryString["meldung"] +
System.Environment.NewLine +
    "URL: " + Request.QueryString["url"] +
System.Environment.NewLine +
    "Zeile: " + Request.QueryString["zeile"]);
}
</script>
<html>
<head>
<title>Fehler entdeckt!</title>
<script type="text/javascript"><!--
  window.close();
//--></script>
</head>
<body>Einen Moment bitte ...</body>
</html>
 <<   zurück
  
  Zum Rheinwerk-Shop
Neuauflage: JavaScript
Neuauflage: JavaScript
bestellen
 Ihre Meinung?
Wie hat Ihnen das Openbook gefallen?
Ihre Meinung

 Buchtipps
Zum Rheinwerk-Shop: jQuery






 jQuery


Zum Rheinwerk-Shop: Einstieg in JavaScript






 Einstieg in JavaScript


Zum Rheinwerk-Shop: Responsive Webdesign






 Responsive Webdesign


Zum Rheinwerk-Shop: Suchmaschinen-Optimierung






 Suchmaschinen-
 Optimierung


 Lieferung
Versandkostenfrei bestellen in Deutschland, Österreich und der Schweiz
InfoInfo




Copyright © Rheinwerk Verlag GmbH 2007
Für Ihren privaten Gebrauch dürfen Sie die Online-Version natürlich ausdrucken. Ansonsten unterliegt das Openbook denselben Bestimmungen, wie die gebundene Ausgabe: Das Werk einschließlich aller seiner Teile ist urheberrechtlich geschützt.
Alle Rechte vorbehalten einschließlich der Vervielfältigung, Übersetzung, Mikroverfilmung sowie Einspeicherung und Verarbeitung in elektronischen Systemen.


Nutzungsbestimmungen | Datenschutz | Impressum

Rheinwerk Verlag, Rheinwerkallee 4, 53227 Bonn, Tel.: 0228.42150.0, Fax 0228.42150.77, service@rheinwerk-verlag.de

Cookie-Einstellungen ändern