Wiki-Quellcode von Datenbank-Authentifikator

Zeige letzte Bearbeiter
1 Für Verwendung des Datenbank-Authentikators ist mindestens die {{formcycle/}}-Version {{version major="7" minor="4" patch="0"/}} nötig.
2
3 {{content/}}
4
5
6 Das kostenpflichtige //Datenbank-Authentikator-Plugin// stellt eine Möglichkeit zur Verfügung eine Anmeldung an einem Formular in Form einer Datenbank-Abfrage durchzuführen. Hierbei kann eine HTML-Seite inkl. Validatoren, Fehlertexten und die eigentliche Anbindung der Datenbank individualisiert werden. Nach dem Absenden der HTML-Seite werden für die Anmeldung die Eingaben der Login-Seite als Platzhalter für die Datenbank-Abfrage bereitgestellt. Auch steht die Möglichkeit zur Verfügung, bei nicht gefundenem Datensatz den "Login" dennoch zu erlauben. Hierbei stehen im Formular dann ausschließlich die Daten aus der Login-Seite zur Verfügung. Ferner ist es möglich eine Login-Sperre zu definieren, welche bei mehrfacher Fehlereingabe den Login anhand eines der Eingabefelder temporär sperrt.
7
8
9 == Konfiguration ==
10
11 === Anmeldeseite ===
12
13 {{figure image="Login_de.png"}}
14 Konfiguration der Login-Seite
15 {{/figure}}
16
17 ; Seitentitel
18 : Gibt den HTML-Title an. Es steht die Verwendung von i18n-Variablen zur Verfügung.
19
20 ; Seiteninhalt
21 : Hier kann der HTML-Inhalt der eigentlichen Login-Seite gepflegt werden. Dieser wird beim Ausliefern automatisch in einen HTML-Rahmen und innerhalb eines FORM-Elements gerendert. Hierbei ist zu beachten, dass alle Eingabefelder welche innerhalb der Datenbank-Abfrage verwendet werden sollen ein name-Attribute besitzen um diese mittels Platzhalter referenzieren zu können. Weiterführende Hilfen finden Sie im Kapitel "Konfigurationsmöglichkeiten der Login-Seite".
22
23 ; Fehlermeldung bei nicht gefundenem Datensatz
24 : Ermöglicht die Änderung der Fehlermeldung, wenn bei der Datenbank-Abfrage kein Datensatz gefunden wurde. Es steht die Verwendung von i18n-Variablen zur Verfügung.
25
26 ; Fehlermeldung bei gesperrtem Login
27 : Ermöglicht die Änderung der Fehlermeldung, wenn der Login temporär gesperrt wurde. Es steht die Verwendung von i18n-Variablen zur Verfügung. Ferner wird das Datum, bis wann der Login gesperrt wurde als Variable zur Verfügung gestellt und kann über die [[Java-Message-Formatierung>>https://docs.oracle.com/en/java/javase/11/docs/api/java.base/java/text/MessageFormat.html]] eingefügt und in dessen Ausgabeformat angepasst werden.
28
29 === Datenbank ===
30
31 {{figure image="DB_de.png"}}
32 Konfiguration der Datenbank-Anbindung inkl. Abfrage
33 {{/figure}}
34
35
36 ; JDBC URL
37 : Definiert die JDBC URL der anzubindenden Datenbank
38
39 ; Benutzername
40 : Definiert den Benutzernamen für den Login an der Datenbank
41
42 ; Passwort
43 : Definiert das Passwort für den Login an der Datenbank
44
45 ; Datenbank-Abfrage
46 : Definiert die eigentliche Datenbank-Abfrage zur Ermittlung eines Datensatzes basierend auf den Eingaben der Login-Seite. Diese Eingaben stehen über Platzhalter in Form von {{code language="none"}}[%<html-name-attribute>%]{{/code}} zur Verfügung. Sobald eine Datenbank-Zeile bei von dieser Abfrage zurückgegeben wird, gilt der Login als erfolgreich.
47
48 ; Erlaube Login ohne gefundenen Datenbank-Eintrag
49 : Ist diese Option aktiv wird der Login auch ohne gefundenen Datenbank-Eintrag erlaubt. Hierbei stehen ausschließlich lediglich die Daten der Login-Seite als Benuterattribute zur Verfügung.
50
51 === Login-Sperre ===
52
53 {{figure image="Lock_de.png"}}
54 Konfiguration der Login-Sperre
55 {{/figure}}
56
57 ; Eingabe-Feld für die Sperr-Identifikation
58 : Definiert den Namen des HTML-Feldes, welches für die Prüfung der Login-Sperre herangezogen wird. Hierbei werden die fehlgeschlagenen Login-Versuche mit dem Wert dieses Feldes gespeichert und bei Überschreiten einer definierten Anzahl ein Login mit diesem temporär verhindert.
59
60 ; Maximale Login-Versuche
61 : Definiert nach wie vielen fehlerhaften Login-Versuchen mit dem selben Wert dieser temporär gesperrt werden soll.
62
63 ; Sperrdauer (in Minuten)
64 : Definiert die Dauer der temporären Login-Sperre
65
66 ; Eingaben beim Auftreten der Login-Sperre deaktivieren
67 : Ist diese Option aktiviert werden alle Eingabefelder der Login-Seite beim Eintreten der Login-Sperre deaktiviert. Hierbei sind dann keine weiteren Eingaben mehr möglich.
68
69 === Zuordnung von Benutzerattributen ===
70
71 {{figure image="Attributes_de.png"}}
72 Zuordnung der Benutzer-Attribute
73 {{/figure}}
74
75 In dieser Liste wird die Zuordnung der ermittelten Werte zu den Stanard-Benutzerattributen angeboten. Hierbei können sowohl die Werte der Datenbank-Abfrage in Form der Spalten-Namen als auch die Werte der Login-Seite in Form der name-Attribute verwendet werden. Überschneiden sich diese Namen wird der Wert der Datenbank-Abfrage bevorzugt.
76
77 == Konfigurationsmöglichkeiten der Login-Seite ==
78
79 Für die Konfiguration der Login-Seite stehen neben den Standards HTML, JavaScript und CSS auch weitere Möglichkeiten zur Verfügung. So wird hier unter anderem die Bibliothek [[jQuery>>https://jquery.com/]] angeboten. Zu beachten ist, dass die Login-Seite für das Absenden einen submit-Button benötigt und ein Container mit der id "error" für die Anzeige von Fehlernachrichten bei nicht erfolgreichem Login angedacht ist.
80
81 === Validierung ===
82
83 Für eine Client-seitige Validierung der Eingaben wird standardmäßig die Bibliothek [[Parsley.js>>https://parsleyjs.org]] eingebunden. Dies ermöglicht es mittels Attributen an den Eingabefeldern z.B. deren Ausfüllung zu verpflichten oder auch ein bestimmtes Format zu erzwingt. Hierbei wird der Absende-Button erst bei erfolgreicher Validierung aller Eingabe-Elemente aktiviert. Eine weiterführende Liste der Möglichkeiten von Parsley.js finden Sie in der entsprechenden [[Dokumentation>>https://parsleyjs.org/doc/index.html]].
84
85 === Weiter Attribute ===
86
87 {{figure image="PW_hidden.png"}}
88 Passwortfeld mit Anzeige-Option
89 {{/figure}}
90
91
92 {{figure image="PW_show.png"}}
93 Sichtbares Passwort
94 {{/figure}}
95
96 Zusätzlich zu der Definition der Validierung stehen noch folgende Plugin-spezifische HTML-Attribute zur Verfügung:
97
98 ; data-keep-enabled
99 : Verhindert das Deaktivieren des Absende-Knopfs bei nicht validen Eingaben und das Deaktivieren einzelner Eingabefeldern bei Auftreten der Login-Sperre.
100
101 ; data-show-type
102 : Ermöglicht es an einem Passwort-Feld einen Input-Typen zu definieren zu welchem mittels eines Auge-Symbols umgeschaltet werden kann. Dies ermöglicht es zu einer lesbaren Darstellungsform der Eingabe umzuschalten.
103 :
104 ; data-custom-tooltip
105 : Ermöglicht die Angabe der ID eines HTML-Containers dessen Inhalt als Tooltip für Element mit diesem Attribut verwendet wird.
106
107 === Styling (CSS) ===
108
109 Das Plugin liefert für das Styling der Login-Seite bereits Standard-Definitionen für das Layout sowie für Eingabe-Elemente, den Login-Button und Fehleranzeigen aus. Diese können innerhalb der Konfiguration der Login-Seite in einem HTML-style-Tag nach Bedarf überschrieben werden. Innerhalb des HTMLs stehen ferner folgende Klassen zur Verfügung:
110
111 ; heading
112 : Definiert einen DIV-Container für die Verwendung als Oberüberschrift.
113
114 ; row
115 : Definiert einen DIV-Container als einzelne Zeile der Login-Seite. Dies ist als Container für das Label, die Beschreibung und den Fehlertext zu einem ebenfalls enthaltenen Eingabefeld vorgesehen.
116
117 ; desc
118 : Definiert einen DIV-Container innerhalb einer Zeile als Beschreibung.
119
120 ; errors
121 : Definiert einen DIV-Container für die Anzeige von Fehlern.
122
123 === Internationalisierung ===
124
125 In der Konfiguration des Seitentitels, des Seiteninhalts sowie in den Fehlermeldungen können die Mandant-spezifischen I18N-Variablen verwendet werden. Diese sind in Form des Platzhalters {{code language="none"}}[%I18N.<Wert>%]{{/code}} anzugeben und werden entsprechend der Aufruf-Sprache des Formulars ersetzt. Die Pflege dieser Variablen finden Sie [[hier>>Formcycle.UserInterface.FilesAndTemplates.I18nVariables]].
126
127 === Beispiel-HTML ===
128
129 {{code language="html"}}
130 <script>
131 <!-- Setzt das maximal auswählbare Daten des Feldes 'GebDatum' auf das aktuelle Daten -->
132 $(document).ready(function() {
133 $('#GebDatum').prop('max', new Date().toLocaleDateString('fr-ca'));
134 });
135 </script>
136
137 <!-- Definition eines Headers inkl. einer Grafik -->
138 <header>
139 <img alt="XIMA" src="https://www.xima.de/typo3conf/ext/xima_sitepackage/Resources/Public/icons/logo.svg" style="height: 30px;" />
140 </header>
141
142 <!-- Definition einer Oberüberschrift -->
143 <div class="heading">
144 <h2>Anmeldung</h2>
145 <div>Um sich zu authentifizieren, geben Sie bitte folgende Daten ein:</div>
146 </div>
147
148 <!-- Definition einer Eingabe-Zeile inkl. Label, Beschreibung und des Containers für Fehlermeldungen -->
149 <div class="row">
150
151 <!-- Verwendung von I18N-Variablen -->
152 <label for="KNr">[%I18N.customerNr%]</label>
153 <div class="desc">[%I18N.customerNr.desc%]</div>
154
155 <!-- Definition des Eingabe-Elements als Passwort-Feld inkl. Validierung auf Ausfüllung, Länge und gegen ein definiertes Pattern. -->
156 <!-- Ebenso wird die Anzeige des Passworts als Text ermöglicht. Ferner wird der Container für etwaige Validierungsfehler angegeben und ein automatisches Ausfüllen durch den Browser deaktiviert. -->
157 <input autocomplete="new-password" data-parsley-errors-container="#KNrErrors" data-show-type="text" id="KNr" maxlength="10" minlength="10" name="KNr" pattern="[A-Z][0-9]{9}" required="" type="password" />
158 <div id="KNrErrors"></div>
159 </div>
160
161 <div class="row">
162 <label for="GebDatum">Geburtsdatum</label>
163 <div class="desc">Bitte geben Sie Ihr Geburtsdatum im Format TT.MM.JJJJ ein.</div>
164 <input autocomplete="new-password" data-parsley-errors-container="#GebDatumErrors" id="GebDatum" name="GebDatum" placeholder="TT.MM.JJJJ" required="" type="date" />
165 <div id="GebDatumErrors"></div>
166 </div>
167
168 <div class="row">
169 <label for="EMail">E-Mail-Adresse</label>
170 <div class="desc">Geben Sie hier Ihre E-Mail-Adresse passend zu Ihren Vertragsdaten ein.</div>
171 <input autocomplete="new-password" data-parsley-errors-container="#EMailErrors" id="EMail" required="" type="email" />
172 <div id="EMailErrors"></div>
173 </div>
174
175 <!-- Definition des Containers für Fehlermeldungen bei nicht erfolgreichem Login -->
176 <div class="errors" id="errors"></div>
177
178 <div class="row">
179 <!-- Definition des Absende-Buttons -->
180 <input type="submit" value="Anmelden" />
181 </div>
182
183 <!-- Definition einer Footers -->
184 <footer>
185 <div style="display: inline-block;">
186 <a href="https://www.xima.de/" target="_blank">XIMA</a>
187 </div>
188 </footer>
189 {{/code}}
190
191
192 == Versionshistorie ==
193
194 === 1.1.0 ===
195
196 * Standard-Validierungs-Events (Parsley) vom Formular entfernt. Diese können damit flexiebler am eigentlichen HTML-Element hinterlegt werden.
197 * Tippy.js für Tooltips hinzugefügt
198 * Eingbau eines Mechanismuses der automatisch Tooltips für Elemente erzeugt.
199 * JavaScript-Callback für das Ausführen von Script vor dem internen hinzugefügt (preInitLoginPage())
200 * Kleinere Anpassungen am Internationalisierungs-Mechanismus
201 * Kleinere CSS Anpassungen
202
203 === 1.0.1 ===
204
205 * Anpassung an der Übergabe der verwendeten Formular-Sprache innerhalb des Authentifikators
206 * Unterstützung von Mandant-spezifischen Platzhaltern innerhalb der Konfiguration der Login-Seite erweitert
207
208 === 1.0.0 ===
209
210 * Initialer Release