Coder

Encode und Decode für HTML, URL, Base64, JSON, Unicode, Hex, Punycode und Quoted-Printable, JWT samt Signaturprüfung, Data-URIs — alles im Browser.

Zehn Encode- und Decode-Werkzeuge an einem Ort

Bei der Web-Entwicklung fällt ständig derselbe Kleinkram an: Du musst schnell ein Stück HTML so escapen, dass spitze Klammern als Text stehen bleiben. Du willst einen Query-Parameter korrekt für eine URL kodieren. Du hast einen Base64-String und keine Ahnung, was drinsteht. Eine Domain mit Umlaut soll in die DNS-Konfiguration. Oder du bekommst ein JWT in die Hand und willst sehen, was die Payload behauptet — und ob die Signatur zum Schlüssel passt. Für jede dieser Aufgaben gibt es Einzeiler, Kommandozeilen-Tricks oder dubiose Online-Konverter — und gerade bei Tokens ist Letzteres heikel.

Der Coder bündelt diese Aufgaben in einem Werkzeug mit zehn Reitern. Du wählst oben den passenden Reiter, fügst deinen Text links ein und klickst Encode oder Decode — das Ergebnis erscheint rechts, deine Eingabe bleibt unverändert stehen. Wer mag, schaltet den Live-Modus ein und sieht das Ergebnis schon beim Tippen. Alles passiert direkt in deinem Browser, ohne Account, ohne Upload, ohne Installation.

Gedacht ist das Tool für alle, die mit Code und Daten hantieren: Entwicklerinnen und Entwickler, die im Alltag zwischen HTML, URLs, Base64 und Unicode-Escapes hin- und herübersetzen; Backend- und API-Leute, die ein JWT inspizieren und gegen Secret oder Public Key prüfen wollen, ohne es einem fremden Server anzuvertrauen; Admins, die mit internationalen Domains oder E-Mail-Quelltexten zu tun haben; und alle, die mal eben ein Bild als Data-URI in ihr CSS oder HTML einbetten möchten.

Die Codecs im Überblick

Die Oberfläche ist auf Englisch — die Reiter heißen im Tool genau so, wie sie hier in Klammern stehen. Acht Reiter teilen sich ein gemeinsames Ein- und Ausgabefeld, JWT und Data URI haben eigene Ansichten. Inhaltlich gruppieren sich die zehn Funktionen in drei Blöcke:

Markup und Web

  • HTML-Entities (Reiter HTML) — wandelt &, < und > in Entities um, auf Wunsch auch Anführungszeichen (&quot;, &#39;, standardmäßig an) und alle Nicht-ASCII-Zeichen (&#228;). Der Decoder versteht alle benannten und numerischen Entities, sofern sie mit Semikolon enden.
  • URL-Encoding (Reiter URL) — Prozent-Kodierung in drei Modi: für einzelne Werte (Component), im Formular-Stil mit + für Leerzeichen (Form) oder für eine ganze URL (Full URL). Enthält der Text einen Query-String, zeigt das Tool die Parameter zusätzlich als Tabelle.
  • Punycode (Reiter Punycode) — übersetzt internationale Domainnamen: bücher.de ↔ xn--bcher-kva.de. Funktioniert mit Domains, ganzen URLs und E-Mail-Adressen, eine pro Zeile.

Binär und Transport

  • Base64 (Reiter Base64) — UTF-8-sicher, optional URL-safe (-_ ohne Padding) und mit MIME-Umbruch nach 76 Zeichen. Beim Dekodieren akzeptiert das Tool auch URL-safe Base64, fehlendes Padding, Zeilenumbrüche und komplette Data-URIs. Binäre Ergebnisse erscheinen als Hex-Dump mit Download und Bildvorschau; auch ganze Dateien lassen sich kodieren.
  • Hex (Reiter Hex) — Text als UTF-8-Bytes in Hexadezimal und zurück, mit wählbarem Trennzeichen und Großschreibung.
  • Quoted-Printable (Reiter Quoted-Printable) — die Kodierung aus E-Mail-Quelltexten nach RFC 2045, UTF-8, mit Zeilen bis 76 Zeichen.
  • Data-URI (Reiter Data URI) — wandelt eine beliebige Datei per Auswahl oder Drag & Drop in eine data:-URI um, wahlweise gleich als CSS-Regel, <img>-Tag, Markdown-Bild oder reines Base64. Der Rückweg macht aus einer eingefügten Data-URI wieder eine Datei.

Daten, Zeichen und Tokens

  • JSON-String (Reiter JSON) — escapt Text für die Verwendung in einem JSON-String (Anführungszeichen, Backslashes, Zeilenumbrüche, alle Steuerzeichen) und macht das wieder rückgängig.
  • Unicode-Escapes (Reiter Unicode) — schreibt Zeichen als \u00E4 (JavaScript, JSON, Java), \u{E4} (ES2015), \E4 (CSS), &#xE4; (HTML) oder Code Points U+00E4. Der Decoder erkennt die Formate von selbst, CSS-Escapes nur bei gewähltem Format CSS.
  • JWT-Decoder und -Prüfer (Reiter JWT) — zerlegt ein JSON Web Token schon beim Einfügen in Header, Payload und Signatur, erklärt die Claims im Klartext, zeigt an, ob das Token abgelaufen oder noch nicht gültig ist, und prüft die Signatur mit Secret, PEM-Public-Key, JWK oder JWKS. Tokens erzeugt das Tool nicht. Details dazu im Manual.

Alles läuft im Browser

Der Coder ist ein reines Client-Tool. Der Server liefert nur die Seite und den Editor aus; das eigentliche Encoden, Decoden und auch die JWT-Signaturprüfung (über die Web-Crypto-Schnittstelle des Browsers) erledigt JavaScript lokal in deinem Browser. Es gibt keine serverseitige Verarbeitung deiner Eingaben.

Das ist nicht nur schnell, sondern vor allem ein Datenschutz-Vorteil: Ein JWT samt Secret, eine Datei, die du als Data-URI einbettest, oder ein String, den du Base64-kodierst — nichts davon verlässt deinen Rechner. Auch lokal speichert der Coder deine Eingaben nur, wenn du das ausdrücklich einschaltest; JWTs speichert er nie.

Jetzt ausprobieren

→ Coder öffnen — Reiter wählen, Text einfügen, Encode oder Decode klicken. Ohne Account, kostenlos, direkt im Browser.

Verwandte JPKCom-Tools

Wenn der Coder an seine Grenzen stößt, übernehmen diese Werkzeuge:

  • Convertor PRO — konvertiert Text zwischen 13 Kodierungen (HTML-Entities, Unicode, UTF-8, Hex u. a.) und Daten zwischen JSON, YAML, TOML, XML und INI. Die größere Schwester für Format-Umwandlungen jenseits der reinen Encode-/Decode-Reiter.
  • JSON Editor — formatiert, validiert und transformiert JSON. Ideal, um eine dekodierte JWT-Payload oder einen unescapten JSON-String weiterzuverarbeiten.
  • Hash-Tool — Hashes, Prüfsummen und HMAC, dazu Passwort-Hashes mit bcrypt, Argon2id und PBKDF2 — die Security-Seite neben dem JWT-Reiter.
  • Generator — erzeugt Passwörter, Schlüssel und TOTP-Codes, etwa ein starkes Secret für HMAC-signierte Tokens.

Tiefer geht es auf den Unterseiten: das Manual mit jedem Reiter im Detail, Beispiele aus der Praxis und gesammelte Tipps & Tricks.