|
Multimediakurs Leinfelder: Inhalt/Modul 7 "JavaScript in Handarbeit"/Modul 7.4 "JavaScript-Level 3/7.4.5 weitere JavaScript-Beispiele mit Erläuterung Level 3, Teil Passwortschutz |
| (© copyright) Letzte Änderungen: |
Arbeiten mit Bildern | Arbeiten mit Formularen | Passwortschutz |
Passwortschutz mit JavaScript
Beispiel: optimierter Passwortschutz mit JavaScript
(Mit dem Passwort pingu33in können Sie das Skript ausprobieren.Es sind aber beliebige Passwörter möglich, lesen Sie untenstehende Erläuterung.)
Generelles zu Passwortschutz von html-Seiten: Bei einem sicheren Passwortschutz etwa für Intranets wird über ein Formular ein Passwort eingegeben und an den http-Server abgeschickt. Dort vergleicht der Server auf Übereinstimmung mit einem in der Serverkonfigurationsdatei eingetragenen Passwort (meist einem bestimmten Usernamen zugeordnet) und rückt das geschützte Dokument erst raus, wenn Übereinstimmung festgestellt wurde (siehe Modul 9). Dies ist auch das Vorgehen, wie die Münchner Realkursteilnehmer an die für sie reservierten Zusatzressourcen herankommen.
Wenn Sie aber bei Ihrem Provider keinen direkten Zugang zur Serverkonfiguration haben (so dass Sie eben dort kein Passwort eintragen können), wird es deutlich schwieriger. Mit JavaScript sind wir ja nur auf der Client-Seite, d.h. alles spielt sich im Browser des Benutzers ab. Dies bedeutet, dass das Passwort, mit dem verglichen werden soll, ja auch nur auf der Client-Seite eingetragen werden kann.
Natürlich können Sie mit JavaScript via prompt-Methode einfach ein vorgegebenes Wort abfragen und mit einem im JavaScript-Code vorgegebenen Wort vergleichen. Via if-Abfrage wird auf Übereinstimmung geprüft, ist diese vorhanden, wird das gewünschte html-Dokument aufgerufen.
Großes Problem bei der Sache: Jeder, der in den JavaScript-Code schaut, findet das Passwort, selbst wenn er nichts von JavaScript versteht.
Es gibt dazu einige Verbesserungen, aber auch die kann man leicht knacken, wenn man, wie Sie mit JavaScript vertraut ist, z.B.:
Nachfolgend eine deutlich sicherere Methode (ein Beispiel, welches u.a. für einem Webprojekt des Kursleiters verwendet wird, ich bin aber auch selbst im Internet irgendwo drüber gestolpert - Dank an die Idee des unbekannten Autors!). Hier wird das Passwort im aufzurufenden Dokument abgelegt. Wie aber kommt JavaScript da zum Abgleich ran? Geht eigentlich nicht. Geht aber dann, wenn das Passwort dem aufzurufenden Dateinamen (ohne .html) entspricht. Wenn Sie also eine Seite schützen wollen, belegen Sie diese mit einem nicht allzu einfachen Namen, z.B. pingu33in.html. Das Passwort wäre dann automatisch pingu33in. Wenn Sie das Passwort mal wechseln wollen, müssen Sie einfach den Dateinamen ändern.
Hier der Skript-Code:
<head>
<title>p_w-test</title>
<script language="JavaScript1.1">
function passwort()
{
window.document.location.href=window.document.pwort.pw.value + ".html";
if(window.document.pwort.pw.value == "")
{
window.alert("Bitte Eingabe vornehmen");
return false;
}
}
</script>
</HEAD>
<BODY BGCOLOR="#FFFFFF">
<P><B>For copyright reasons these files are not available
freely.</B></P>
<P><I>Passwort requests :
</I><A HREF="mailto:rleinfelder@web.de"><I>send
mail.</I></A></P>
<P><FORM name=pwort>
<P><B>Please type in password:</B>
<INPUT TYPE="password" NAME=pw VALUE="" SIZE="10" MAXLENGTH="10">
<INPUT TYPE="button" NAME="Taste" VALUE="-Ok-" onclick="passwort()">
<B>Please click the OK button after typing the password</B>
(Hitting the return or enter key does not work)</P>
Weitere Erläuterung. Im Body wird ein kleines Formular mit Name pwort angelegt. Dort gibt es ein Texteingabefeld, welches pw heißt. Der Typ des Eingabefelds ist aber nicht text sondern password. Dies bewirkt, dass bei der Eingabe nicht diese direkt angezeigt wird, sondern nur Punkte (falls Ihnen bei der Eingabe jemand über die Schulter schauen sollte). Die Anzeigegröße ist auf 10 Zeichen gesetzt, die max. Eingabelänge ebenfalls auf 10 (ist Ihr Dateiname länger, müssen Sie dies ggf. ändern). Bei Klick auf den Absendebutton , wird per Evenhandler die Funkion passwort() aufgerufen.
Im Skript soll eine Seite via document.href-Anweisung aufgerufen werden. Der aufzurufende Dokumentenname besteht aus dem Wert der Eingabe ins Passwortfeld (also dem Passwort), an den dann noch der String .html angehängt wird. Wurde also pingu33in eingegeben, wird eine Seite pingu33in.html aufgerufen. Gibt es die Seite nicht (d.h. das Passwort war falsch), gibt es die Browser-Fehlermeldung "Document not found", über die sich der Benutzer vielleicht wundert. Hat er gar nichts eingegeben, kommt die Alert-Box. (Da das Passwort ja nicht im Skript hinterlegt ist, gibt es leider keine Möglichkeit eine Ausgabe zu erzeugen, die etwa den Hinweis "falsches Passwort" ausgibt).
Wichtig bei der Benutzung: nur der Zugang via dieser Passwortseite ist geschützt. Kennt jemand den Dateinamen, kann er die Datei auch direkt auch ohne Passwort aufrufen. Wenn Sie untenstehendes beachten, sind die Dateinamen aber nicht bekannt. Sie dürfen natürlich auch keine direkten Links auf die geschützte Seite legen, sondern nur über diese Passwortseite.
Suchmaschinen könnten die Seite ggf. dennoch direkt finden. Sie sollten deshalb einen "No Index"-Metatag " auf Ihrer geschützen Seiten (z.B. pingu33in.html) eingeben (im Header: <Meta name="robots" content="noindex">). Dieser Tag sollte auf allen zu schützenden Seiten stehen.
Wichtig: wenn die zu schützenden Seiten in einem Ordner liegen, der kein index.html oder index.htm File enthält, zeigen die meisten Webserver das Inhaltsverzeichnis des Ordners an, wenn man nur den Ordnernamen aufruft (z.B. www.provider.de/meinordner/
(in manchen Servern muss das bei Ordnernennung automatisch aufgerufene File auch default.html oder default.htm heißen. Manchmal ist auch ein anderer Dateiname als index-File eingestellt)
Damit könnten natürlich dann alle Files bzw. Filenamen ausprobiert werden und der Passwortschutz wäre weg (ich kenne einige Seiten im Web, die unseren Passwortschutz verwenden, aber dieses Problem vergessen haben). Am besten nennen Sie das File mit der Passwortabfrage index.html (bzw. analog zum vom Webserver für index-files vorgesehenen Namen), damit ist das ganze Verzeichnis nicht einsehbar. Alle Files des Verzeichnisses, die mit dem zu schützenden File verlinkt sind, sollten ebenfalls das no-robot-Metatag bekommen.
(Hinweis nur für die Realkurs-Teilnehmer in München: Unsere Webserver-Software lässt das Inhaltsverzeichnis eines Ordners über http nur aufrufen, wenn a) kein File mit Name index.html bzw. index.htm bzw. index.shtm vorhanden ist sowie zusätzlich eine Datei mit dem Namen .message in den Ordner gelegt wurde. Das sind die .message-Files, die Sie in Ihren Kursordnern per ftp ebenfalls sehen und nicht löschen sollen. Sie erlauben, dass Sie Ihre Ordnerinhalte auch via http einsehen und benutzen können).
alle obigen Skriptbeispiele sowie frühere sind im Anhang zu Modul 7 aufgelistet.
>> Modul 7.4.5: Level 3-Beispiele, Fortsetzung (Utilities)
<< Modul 7.4.5: Level 3-Beispiele (Formulare)