Login 02 - Username + Password
Script für einen Gastlogin und beliebig viele andere Zugänge. Jeder User wird zu einer separaten Datei umgeleitet. Das bedeutet bei 10 Usern / Usergruppen mit unterschiedlichen Berechtigungen müssen 10 Zieldateien (evtl. plus einer Gastseite) eingerichtet werden.
23.03.2008 - 09:00 Uhr, Möglichkeit der Pfadangaben, Vorgaben des Anzeigeortes, Erklärungen
Arbeitsweise
Die beiden eingetragenen Werte in den Feldern 'Username' und 'Passwort' werden vom JavaScript zu einem Dateinamen zusammengefügt. Diese Datei wird dann aufgerufen und angezeigt, wenn sie existiert.
Funktion
Eingaben in zwei Textfeldern werden nach dem Klicken des Submit-Buttons weiterverarbeitet. Die eingegebenen alphanumerischen Zeichen (Buchstaben) werden in Kleinbuchstaben umgewandelt, um Eingabefehler abzufangen. Daher MÜSSEN Buchstaben im Dateinamen immer in Keinbuchstaben abgespeichert werden. Ziffern (Zahlen) bleiben bei der Umwandlung unberücksichtigt.
Nun kann man unendlich viele Zugänge für User einrichten. Es muss lediglich eine Datei für den jeweiligen User vorhanden sein, deren Name sich aus 'Username' und 'Password' zusammensetzt.
Das JavaScript setzt die Eingaben aus den Formularfeldern nach diesem Schema zusammen. Ein Bindestrich wird eingefügt und am Ende noch einen Punkt (.) und die Dateiendung 'htm' angehängt.
url = username + "-" + password + ".htm"
Klartext: Username + Minuszeichen + Password + Punkt + htm
| Beispiel: | Eingabe für den Usernamen: |
Apollo |
| | Eingabe für das Password: |
123AB |
Durch eine JavaScript-Anweisung werden die Textteile nun zusammengesetzt ...
url = "Apollo" + "-" + "123AB" + ".htm"
... und nach einer Umwandlung in Kleinbuchstaben wird daraus ...
url = "apollo-123ab.htm"
... genau der Dateiname der Datei, die dann aufgerufen werden soll.
Vorteil
Der Vorteil dieses Verfahrens ist: Nirgendwo im Quelltext sind Username oder Password nachzulesen. Folglich können Usernamen, Passwörter und Dateinamen nicht durch "Quelltext anzeigen" herausgefunden werden!
Eine oder mehrere Seiten für bestimmte User?
Mit diesem LogIn ist es also möglich, ausgewählten Besuchern eine bestimmte Seite anzuzeigen. Sollen diese Besucher aber den Zugriff auf mehrere Seiten haben, müssen sie nicht zwangsläufig mehrere LogIn-Seiten herstellen!
Mit einmal 'um die Ecke denken' käme auch ihnen die Idee, innerhalb eines Framesets abhängig von Username und Password unterschiedliche Menüs anzuzeigen, die dann die Anwahl von mehreren Seiten ermöglichen.
|
|
|
Nachteil
Ein Fehler bei der Eingabe oder Herumprobieren nicht zugangsberechtigter Seitenbesucher, endet mit einem Dateiaufruf, für den es keine zugehörige Datei gibt. Das Resultat ist unterschiedlich, abhängig vom Hostinganbieter:
- Error404-Meldung des Servers
- Umleitung zur Startseite oder Meldung des Anbieters
- Anzeige des Ordnerinhalts
1) Bei einer Error404-Anzeige wäre es elegant, eine eigene Error404-Datei zu erstellen. Für die Anzeige der eigenen Error-Nachricht ist allerdings ein Eintrag in die auf dem Server abgelegte Datei '.htaccess' notwendig.
2) Eine Meldung des WebSpace-Anbieters weist gewöhnlich auf einen nicht berechtigten Zugriff mit Hinweistexten wie 'forbidden' oder 'Zugriff nicht erlaubt' hin.
3) Um eine Anzeige des Ordnerinhalts wird heute zwar in der Regel unterdrückt, um dem aber sicherheitshalber entgegen zu wirken, sollte im gleichen Verzeichnis eine Datei mit dem Namen 'index.htm' abgelegt werden. Der Server leitet für gewöhnlich auf diese Datei um.
Zusätzliches Feature: Gast-LogIn
Hier wurde ein Gastlogin vorgesehen, der den Besuchern ohne Usernamen und Passwort den Zugang zu einer dazu vorgesehenen Seite ermöglicht. Mit dem Gastlogin kann wenn sie möchten, auf eine festgelegte Datei weitergeleitet.
// feste Zieldatei
// window.location="IhrDateiname.htm";
// zusammengesetzter Dateiname
window.location="gast-login.htm";
Falls der Gastlogin nicht erwünscht ist, lassen sie den erklärenden Text dazu einfach weg!
Fehler vermeiden
Das JavaScript setzt ja die Eingaben zusammen wie folgt:
username + "-" + password + ".htm" Der Dateiname wäre: "username-password.htm"
Folglich sollten die Dateinamen abhängig von Username und Password so lauten:
| Username |
Password |
Dateiname |
| Jupp |
Katze |
jupp-katze.htm |
| Vera |
1234 |
vera-1234.htm |
| Spider |
Az2Fz7 |
spider-az2fz7.htm |
Wichtige Voraussetzungen für die Funktion:
a) Unbedingt Groß- Kleinschreibung beachten (Dateiname in Kleinschrift).
b) Die Dateiendung soll 'htm' und nicht 'html' sein!
Diese Dateien würden bei einer Eingabe von Spider und Az2fz7 nicht gefunden werden:
Spider-Az2fz7.htm
| falsch: großes S
|
spider-Az2fz7.htm
| falsch: großes A
|
spider-Az2Fz7.htm
| falsch: großes F
|
spider-az2fz7.html
| falsch: html
|
Eine erfolgreiche Weiterleitung ist nur durch das Vorhandensein der Datei spider-az2fz7.htm in Kleinschrift gewährleistet.
Bei einem Einsatz im Frameset
Die Voreinstellung tauscht die Login-Datei gegen die vom Script aufgerufene Datei. Die User-Datei wird also an der gleichen Stelle / im gleichen Fenster angezeigt werden, wo die Login-Datei zu sehen war. Das funktioniert auch im Frameset.
Innerhalb eines Framesets, können sie als Ort der Anzeige auch einen anderen Frame bestimmen.
Soll ein anderer Frameinhalt oder sogar der gesamte Frameset ausgetauscht werden, muss die im Script aktive Standard-Anweisung deaktiviert und eine andere aktiviert werden. Setzen sie zur Deaktivierung vor die betreffende Zeile zwei Slashes (//) und entfernen die beiden Slashes (//) vor der zu aktivierenden Programmzeile.
| Anweisung |
Anzeige |
Einstellung |
| this.window.location = url; |
im aktuellen Fenster |
Standard / Default |
| top.location = url; |
im höchsten Frameset |
alternativ |
| top.NameDesFrames.location.href = url; |
im benannten Frame |
alternativ |
entsprechende Kommentare habe ich im Quelltext eingetragen.
Formatierung des Buttons
<input style=" xxx " type="button" ...
Für "xxx" tragen sie z.B. dieseFormatierungsangaben ein:
font-family:Arial,Helvetica;
font-size:13;
color:#000000;
border-width:1;
border-color:#000000;
background-color:#FFF1BE;
text-align:center;
width=80;
Eine weitere Variante der Formatierung mittels CSS sehen sie in meinem Beispiel zu diesem Script. Das Beispiel ist im Download enthalten.
|