encodeURIComponent()

uriComponent

Ein zu kodierender String als URI-Komponente (ein Pfad, Abfragezeichenfolge, Fragment usw.). Andere Werte werden in Strings umgewandelt.

Ein neuer String, der die bereitgestellte uriComponent als URI-Komponente kodiert darstellt.

URIError

Wird ausgelöst, wenn uriComponent einen einsamen Surrogaten enthält.

encodeURIComponent() ist eine Funktions-Eigenschaft des globalen Objekts.

encodeURIComponent() verwendet den gleichen Kodierungsalgorithmus wie in encodeURI() beschrieben. Es entkommt allen Zeichen außer:

A–Z a–z 0–9 - _ . ! ~ * ' ( )

Im Vergleich zu encodeURI() entkommt encodeURIComponent() einer größeren Anzahl von Zeichen. Verwenden Sie encodeURIComponent() für benutzereingetragene Felder von Formularen, die POST an den Server gesendet werden — dies kodiert & Symbole, die möglicherweise versehentlich während der Dateneingabe für Zeichenreferenzen oder andere Zeichen, die eine Kodierung/Dekodierung erfordern, generiert werden. Wenn ein Benutzer beispielsweise Jack & Jill schreibt, könnte das kaufmännische Und ohne encodeURIComponent() auf dem Server als Start eines neuen Feldes interpretiert werden und die Datenintegrität gefährden.

Für application/x-www-form-urlencoded sollten Leerzeichen durch + ersetzt werden, daher möchte man möglicherweise eine encodeURIComponent() Ersetzung mit einer zusätzlichen Ersetzung von %20 durch + abschließen.

Das folgende Beispiel zeigt die spezielle Kodierung, die innerhalb der UTF-8 Content-Disposition und Link Serverantwort-Header-Parameter erforderlich ist (z. B. UTF-8 Dateinamen):

const fileName = "my file(2).txt";
const header = `Content-Disposition: attachment; filename*=UTF-8''${encodeRFC5987ValueChars(
  fileName,
)}`;

console.log(header);
// "Content-Disposition: attachment; filename*=UTF-8''my%20file%282%29.txt"

function encodeRFC5987ValueChars(str) {
  return (
    encodeURIComponent(str)
      // The following creates the sequences %27 %28 %29 %2A (Note that
      // the valid encoding of "*" is %2A, which necessitates calling
      // toUpperCase() to properly encode). Although RFC3986 reserves "!",
      // RFC5987 does not, so we do not need to escape it.
      .replace(
        /['()*]/g,
        (c) => `%${c.charCodeAt(0).toString(16).toUpperCase()}`,
      )
      // The following are not required for percent-encoding per RFC5987,
      // so we can allow for a little better readability over the wire: |`^
      .replace(/%(7C|60|5E)/g, (str, hex) =>
        String.fromCharCode(parseInt(hex, 16)),
      )
  );
}

Der neuere RFC3986 reserviert !, ', (, ), und *, obwohl diese Zeichen keine formalen URI-Abgrenzungs-Verwendungen haben. Die folgende Funktion kodiert einen String für das RFC3986-konforme URL-Komponenten-Format. Sie kodiert auch [ und ], die Teil der IPv6 URI-Syntax sind. Eine RFC3986-konforme encodeURI Implementierung sollte sie nicht entkommen lassen, was im encodeURI() Beispiel gezeigt wird.

function encodeRFC3986URIComponent(str) {
  return encodeURIComponent(str).replace(
    /[!'()*]/g,
    (c) => `%${c.charCodeAt(0).toString(16).toUpperCase()}`,
  );
}

Ein URIError wird ausgelöst, wenn man versucht, einen Surrogaten zu kodieren, der nicht Teil eines Hoch-Tief-Paares ist. Zum Beispiel:

// High-low pair OK
encodeURIComponent("\uD800\uDFFF"); // "%F0%90%8F%BF"

// Lone high-surrogate code unit throws "URIError: malformed URI sequence"
encodeURIComponent("\uD800");

// Lone high-surrogate code unit throws "URIError: malformed URI sequence"
encodeURIComponent("\uDFFF");

Sie können String.prototype.toWellFormed() verwenden, das einsame Surrogate durch das Unicode-Ersatzzeichen (U+FFFD) ersetzt, um diesen Fehler zu vermeiden. Sie können auch String.prototype.isWellFormed() verwenden, um zu überprüfen, ob ein String einsame Surrogate enthält, bevor Sie ihn an encodeURIComponent() übergeben.

• decodeURI()
• encodeURI()
• decodeURIComponent()