Sommario
La funzione encodeURIComponent()
codifica un componente di un URI sostituendo alcuni specifici caratteri con una, due, tre o quattro sequenze di escape, che rappresentano il carattere codificato in UTF-8 (le sequenze di quattro caratteri di escape verrano solo create per i caratteri composti da due caratteri "surrogati").
Sintassi
encodeURIComponent(uriComponent);
Parametri
uriComponent
- Una parte di un URI
Descrizione
encodeURIComponent
sostituisce tutti i caratteri esclusi i seguenti: lettere, cifre, - _ . ! ~ * ' ( )
Se si tenta di codificare un surrogato che non è parte di una coppia, verrà generato un URIError
.
// Coppia surrogata: Ok encodeURIComponent("\uD800\uDFFF"); // Solo il primo carattere surrogato: // Viene generato un "URIError: malformed URI sequence" encodeURIComponent("\uD800"); // Solo il secondo carattere surrogato: // Viene generato un "URIError: malformed URI sequence" encodeURIComponent("\uDFFF");
Per evitare problemi inaspettati durante le richieste al server, bisognerebbe richiamare encodeURIComponent
su ogni dato inserito dall'utente che verrà passato come parte di un URI. Per esempio, un un utente potrebbe digitare "Cani&Gatti = animali"
. Senza utilizzare la funzione encodeURIComponent
, la richiesta verrebbe costruita in modo simile a "commento=Cani&Gatti%20=%20animali
". Notare che sono due variabili separate: "commento
" e "Gatti%20
". Utilizzando quuesta funzione verrebbe invece costruita come "commento=Cani%26Gatti%20%3D%20animali
".
Utilizzando application/x-www-form-urlencoded
, gli spazi devono essere sostituiti da un "+
"., quindi si potrebbe usare la funzione encodeURIComponent
seguita da un altra sostituzione da "%20
" a "+
".
Per aderire con più precisione allo standard RFC 3986 (secondo il quale !
, '
, (
, )
e *
sono caratteri riservati), si può usare la seguente funzione:
function fixedEncodeURIComponent(str) { return encodeURIComponent(str).replace(/[!'()*]/g, function (c) { return '%' + c.charCodeAt(0).toString(16); }); }
Esempi
Il seguente esempio fornisce un metodo per codificare come richiesto dall'header Content-Disposition
:
var fileName = 'my file(2).txt'; var header = "Content-Disposition: attachment; filename*=UTF-8''" + encodeRFC5987ValueChars(fileName); console.log(header); // logs "Content-Disposition: attachment; filename*=UTF-8''my%20file%282%29.txt" function encodeRFC5987ValueChars (str) { return encodeURIComponent(str). // Notare che anche se per l'RFC3986 "!" è riservato, non lo è per // l' RFC5987, quindi non viene sostituito replace(/['()]/g, escape). // i.e., %27 %28 %29 replace(/\*/g, '%2A'). // Per l'RFC5987 questi caratteri non necessitano di essere codificati, // quindi possiamo consentire un po' più di leggibilità: |`^ replace(/%(?:7C|60|5E)/g, unescape); }
Specifiche
Specifica | Stato | Commenti |
---|---|---|
ECMAScript 3rd Edition. | Standard | Definizione iniziale. |
ECMAScript 5.1 (ECMA-262) The definition of 'encodeURIComponent' in that specification. |
Standard | |
ECMAScript 6 (ECMA-262) The definition of 'encodeURIComponent' in that specification. |
Release Candidate |
Compatibilità con i browser
Funzionalità | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Supporto di base | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) |
Funzionalità | Android | Chrome for Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Supporto di base | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) |