Kostenloser HTML-Entity-Encoder Online

Sonderzeichen in HTML-Entities konvertieren für sichere Anzeige in HTML.

0 Zeichen

Was ist HTML-Entity-Kodierung?

HTML-Entity-Kodierung wandelt Sonderzeichen in HTML-Entities (Textdarstellungen) um, die Browser sicher anzeigen können. Dies verhindert, dass Zeichen mit besonderer Bedeutung in HTML als Code interpretiert werden.

Kritische Anwendungen der HTML-Entity-Kodierung

  • XSS-Angriffe (Cross-Site Scripting) verhindern: Dies ist der Hauptgrund für HTML-Kodierung. Beim Anzeigen von Benutzereingaben (Kommentare, Benutzernamen, Suchanfragen, Formulardaten) müssen Sie diese kodieren, um zu verhindern, dass Angreifer böswillige Skripte injizieren. Zum Beispiel würde ohne Kodierung ein Benutzername wie <img src=x onerror=alert(document.cookie)> JavaScript ausführen und Cookies stehlen. Mit Kodierung wird es zu harmlosem Text: &lt;img src=x onerror=alert(document.cookie)&gt;. Jedes Web-Framework (Django, Rails, Laravel, ASP.NET) enthält HTML-Kodierungsfunktionen. Verwenden Sie sie konsequent.
  • Benutzergenerierte Inhalte anzeigen: Alle von Benutzern übermittelten Inhalte (Blog-Kommentare, Forenbeiträge, Produktbewertungen, Chat-Nachrichten, Profilbeschreibungen) müssen vor der Anzeige HTML-kodiert werden. Angreifer werden definitiv versuchen, böswilligen Code durch diese Eingaben zu injizieren. Selbst scheinbar sichere Felder wie E-Mail-Adressen oder Telefonnummern können < > Zeichen in Angriffen enthalten. Kodieren Sie alles aus nicht vertrauenswürdigen Quellen.
  • Code-Beispiele und Snippets anzeigen: Beim Anzeigen von HTML-, XML- oder Code-Snippets auf Websites (Tutorials, Dokumentation, Entwickler-Blogs) kodieren Sie den Code, damit Browser ihn als Text anstatt ihn zu rendern anzeigen. Zum Beispiel müssen Sie <div>Hello</div> als &lt;div&gt;Hello&lt;/div&gt; kodieren, um es auf einer Seite anzuzeigen. Ohne Kodierung rendert der Browser ein tatsächliches div-Element, anstatt den Code zu zeigen.
  • HTML-Attributwerte kodieren: Beim Einfügen dynamischer Daten in HTML-Attribute (insbesondere href, src, onclick) kodieren Sie die Werte, um Attribut-Bruch und JavaScript-Injection zu verhindern. Zum Beispiel ist <a href="USERDATA"> anfällig, wenn USERDATA "> (schließt das Attribut) gefolgt von böswilligen Attributen enthält. Die Kodierung des Anführungszeichens als &quot; verhindert diesen Angriff. Kodieren Sie immer Attributwerte, auch für "sicher" aussehende Daten.

Wie funktioniert HTML-Entity-Kodierung?

HTML-Entity-Kodierung ersetzt Zeichen, die in HTML eine besondere Bedeutung haben, durch benannte oder numerische Entity-Referenzen. Dies stellt sicher, dass Browser die Zeichen als Text anzeigen, anstatt sie als HTML-Markup zu interpretieren. Hier ist der technische Prozess:

  • Schritt 1 - Sonderzeichen identifizieren: Die fünf kritischen Zeichen sind: & (Ampersand), < (kleiner als), > (größer als), " (doppeltes Anführungszeichen) und ' (einfaches Anführungszeichen/Apostroph).
  • Schritt 2 - Durch benannte Entities ersetzen: Jedes Sonderzeichen wird durch seine HTML-Entity ersetzt: & wird zu &, < wird zu <, > wird zu >, " wird zu ", ' wird zu '.
  • Schritt 3 - Sichere Zeichen beibehalten: Buchstaben, Ziffern und gängige Satzzeichen, die in HTML keine besondere Bedeutung haben, bleiben unverändert.
  • Schritt 4 - Erweiterte Zeichen behandeln: Nicht-ASCII-Zeichen können optional als numerische Entities kodiert werden (z.B. é wird zu é oder é) für Kompatibilität mit älteren Systemen.

Beispiel: Der String "" wird zu "<script>alert("XSS")</script>" kodiert, was Browser sicher als Text anzeigen, anstatt es als Code auszuführen.

HTML-Entities und Web-Sicherheit

HTML-Entities wurden in der ursprünglichen HTML-Spezifikation definiert, um die Anzeige reservierter Zeichen zu ermöglichen. Die aktuelle HTML5-Spezifikation, die von WHATWG gepflegt wird, definiert den vollständigen Satz benannter Zeichenreferenzen. Ihre kritische Sicherheitsrolle entstand jedoch in den späten 1990er Jahren, als XSS-Angriffe aufkamen. OWASP (Open Web Application Security Project) listet XSS jedes Jahr in den Top 10 der Web-Schwachstellen auf. HTML-Entity-Kodierung ist die primäre Verteidigung: Durch Konvertierung von < zu < werden böswillige Skripte wie zu harmlosem Text: <script>alert(1)</script>. Die moderne Web-Sicherheit hängt von konsistenter, korrekter HTML-Kodierung aller nicht vertrauenswürdigen Daten vor der Ausgabe ab.

Kritische Sicherheitsrichtlinien

HTML-Kodierung verhindert XSS-Angriffe, indem Sonderzeichen in sichere Entities konvertiert werden. Kodieren Sie Benutzereingaben immer vor der Anzeige auf Webseiten. Erfahren Sie mehr über Kodierungssicherheit

HTML-Entity-Kodierung in Programmiersprachen

Jedes Web-Framework bietet HTML-Kodierung zur Verhinderung von XSS. Hier sind umfassende Beispiele:

// htmlspecialchars() - Standard-Kodierung (empfohlen)
$encoded = htmlspecialchars($data, ENT_QUOTES, 'UTF-8');
// Kodiert: < > & " '

// htmlentities() - kodiert ALLE Sonderzeichen
$encoded = htmlentities($data, ENT_QUOTES, 'UTF-8');
// Kodiert: < > & " ' plus akzentuierte Zeichen, etc.

// Für Attributwerte (immer ENT_QUOTES verwenden)
echo '<div title="' . htmlspecialchars($userInput, ENT_QUOTES, 'UTF-8') . '">';

// Laravel Blade-Templates (Auto-Kodierung)
// {{ $userInput }} - automatisch HTML-kodiert
// Browser: textContent (automatische Kodierung - empfohlen)
element.textContent = userInput; // Sicher, auto-kodiert

// Elemente sicher erstellen
const div = document.createElement('div');
div.textContent = userInput; // Sicher

// Manuelle Kodierungsfunktion
function htmlEncode(str) {
    const div = document.createElement('div');
    div.textContent = str;
    return div.innerHTML;
}

// Bibliothek: DOMPurify (für HTML-Bereinigung)
const clean = DOMPurify.sanitize(dirtyHTML);
import html

# html.escape() - Standard-Kodierung
encoded = html.escape(userInput)
# Kodiert: < > &

# Mit Anführungszeichen-Kodierung
encoded = html.escape(userInput, quote=True)
# Kodiert: < > & " '

# Django-Templates (Auto-Kodierung)
# {{ user_input }} - automatisch HTML-kodiert
# {{ user_input|safe }} - KEINE Kodierung (gefährlich!)

# Jinja2-Templates (Auto-Kodierung)
# {{ user_input }} - automatisch kodiert
import "html"

// html.EscapeString() - Standard-Kodierung
encoded := html.EscapeString(userInput)
// Kodiert: < > & " '

// In Go-Templates (html/template-Paket kodiert automatisch)
tmpl := template.Must(template.New("page").Parse("<p>{{.}}</p>"))
tmpl.Execute(w, userInput) // Auto-kodiert sicher
// Apache Commons Text (empfohlen)
import org.apache.commons.text.StringEscapeUtils;
String encoded = StringEscapeUtils.escapeHtml4(userInput);
// Kodiert: < > & " '

// OWASP Java Encoder (am sichersten)
import org.owasp.encoder.Encode;
String encoded = Encode.forHtml(userInput);

// Spring MVC (Auto-Kodierung in JSP)
// <c:out value="${userInput}"/> - auto-kodiert
require 'cgi'

# CGI.escapeHTML() - Standard-Kodierung
encoded = CGI.escapeHTML(user_input)
# Kodiert: < > & " '

# Rails (ERB-Templates auto-kodieren)
# <%= user_input %> - automatisch HTML-kodiert
# <%== user_input %> - KEINE Kodierung (gefährlich!)

# html_safe-Marker (sagt Rails, String ist sicher)
# safe_html.html_safe - überspringt Kodierung
using System.Web;
using System.Net;

// HttpUtility.HtmlEncode() - Standard-Kodierung
string encoded = HttpUtility.HtmlEncode(userInput);
// Kodiert: < > & " '

// WebUtility (keine System.Web-Abhängigkeit)
string encoded = WebUtility.HtmlEncode(userInput);

// Razor-Views (Auto-Kodierung)
// @Model.UserInput - automatisch HTML-kodiert
// @Html.Raw(Model.UserInput) - KEINE Kodierung (gefährlich!)

Verwandte Tools

Müssen Sie HTML-Entities dekodieren? Verwenden Sie unseren HTML-Entity-Decoder, um < > & zurück in Zeichen zu konvertieren.

Daten für URLs kodieren? Probieren Sie unseren URL-Encoder aus, um Text URL-sicher zu machen.

Binärdaten kodieren? Verwenden Sie unseren Base64-Encoder für Binär-zu-Text-Konvertierung.