Eingabevalidierung und Grundlagen des Escapens
Eingaben mit kleinen Allowlists und Guards validieren und normalisieren; riskante Zeichen vor der Anzeige von Text escapen
Eingabevalidierung und Grundlagen des Escapens ist eine kostenlose JavaScript Academy-Lektion auf CoddyKit. Dies ist Lektion 1 von 3. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des JavaScript Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der JavaScript Academy-Kurs umfasst insgesamt 3 Lektionen.
Das Wichtigste im Überblick
Ziel: Eingaben einfach und sicher machen.
- Verwenden Sie Guard Clauses, um frühzeitig abzulehnen
- Bevorzugen Sie Allowlists gegenüber vagen Regeln
- Normalisieren Sie auf eine einfache Struktur
- Maskieren Sie Sonderzeichen, bevor Sie Text anzeigen
Grundlagen der Zahlenvalidierung
Fügen Sie einfache Prüfungen hinzu: Typ prüfen, Wertebereich prüfen und auf einen endgültigen Wert normalisieren.
// Validate age: number and range guard
function parseAge(input) {
// trim and parse
const n = Number(input);
if (!Number.isFinite(n)) return null; // reject non-numbers
if (n < 0 || n > 130) return null; // reject out-of-range
return Math.floor(n); // normalize to integer
}
console.log("age ok:", parseAge("21"));
console.log("age bad:", parseAge("twenty"));
Escapen für die sichere Anzeige
Bevor Sie Benutzertext anzeigen, escapen Sie Sonderzeichen, damit die Benutzeroberfläche ihn als reinen Text behandelt.
// Escape a few risky characters before displaying in HTML contexts
function escapeText(s) {
if (typeof s !== "string") return "";
return s
.replaceAll("&", "&")
.replaceAll("<", "<")
.replaceAll(">", ">")
.replaceAll("\"", """)
.replaceAll("'", "'");
}
console.log("escaped:", escapeText("<b>Hello & bye</b>"));
Allowlists in der Praxis
Bevorzugen Sie Allowlists für feste Mengen (z. B. Codes oder Rollen). Normalisieren Sie Groß-/Kleinschreibung und Leerzeichen.
// Allowlist example: only certain country codes
const ALLOWED = new Set(["TR", "US", "DE", "GB"]);
function parseCountry(code) {
if (typeof code !== "string") return null;
const up = code.trim().toUpperCase();
if (!ALLOWED.has(up)) return null; // reject unknown
return up; // normalized
}
console.log("country ok:", parseCountry("tr"));
console.log("country bad:", parseCountry("xx"));
Kleiner Objekt-Validator
Prüfen Sie Typ und Grenzen und geben Sie anschließend eine normalisierte Struktur zurück, der Ihr restlicher Code vertrauen kann.
// Validate a tiny user object and normalize
function validateUser(input) {
if (typeof input !== "object" || input === null) return null;
const nameOk = typeof input.name === "string" && input.name.trim().length >= 1 && input.name.trim().length <= 40;
const ageOk = parseAge(input.age) !== null;
if (!nameOk || !ageOk) return null;
return {
name: input.name.trim(),
age: parseAge(input.age)
};
}
console.log("user ok:", validateUser({ name: " Ayla ", age: "22" }));
console.log("user bad:", validateUser({ name: "", age: "old" }));
Gute defensive Gewohnheiten
Tipps:
- Validieren Sie an den Grenzen (Benutzereingaben, Netzwerk).
- Verwenden Sie Allowlists, Wertebereiche und Typprüfungen.
- Normalisieren Sie einmal; halten Sie den Rest einfach.
- Escapen Sie Text, bevor Sie ihn Benutzern anzeigen.
Quiz zu den Grundlagen defensiver Eingaben
Kurzer Test: Sicheres Eingabemuster.
Zusammenfassung
Zusammenfassung: Sichern Sie frühzeitig ab, verwenden Sie Allowlists, normalisieren Sie auf eine sichere Struktur und escapen Sie vor der Anzeige. Halten Sie jeden Schritt klein und gut lesbar.
Häufig gestellte Fragen
Ist die Lektion „Eingabevalidierung und Grundlagen des Escapens“ kostenlos?
Ja — der vollständige Text von „Eingabevalidierung und Grundlagen des Escapens“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des JavaScript Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der JavaScript Academy-Kurs umfasst insgesamt 3 Lektionen.
Was lerne ich in „Eingabevalidierung und Grundlagen des Escapens“?
Eingaben mit kleinen Allowlists und Guards validieren und normalisieren; riskante Zeichen vor der Anzeige von Text escapen Du übst JavaScript Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.
Brauche ich Erfahrung, um JavaScript Academy zu starten?
Keine Vorkenntnisse erforderlich. JavaScript Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 1 von 3.
Wie lange dauert die Lektion „Eingabevalidierung und Grundlagen des Escapens“?
Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.
Kann ich in dieser JavaScript Academy-Lektion Code schreiben und ausführen?
Ja. Jede JavaScript Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.
Alle Lektionen in diesem Kurs
- Eingabevalidierung und Grundlagen des Escapens
- Sicheres Zusammenführen von Objekten; Einfrieren und Versiegeln
- Error Boundaries (konzeptionell) ohne Frameworks