la différence entre encodeURI() et encodeURIComponent() sont exactement 11 caractères encodés par encodeURIComponent mais pas par encodeURI:

j'ai généré cette table facilement avec la console .tableau dans Google Chrome avec ce code:

var arr = [];
for(var i=0;i<256;i++) {
  var char=String.fromCharCode(i);
  if(encodeURI(char)!==encodeURIComponent(char)) {
    arr.push({
      character:char,
      encodeURI:encodeURI(char),
      encodeURIComponent:encodeURIComponent(char)
    });
  }
}
console.table(arr);

j'ai trouvé cet article instructif : Javascript Folie: Chaîne De Requête D'Analyse

Je l'ai trouvé quand j'essayais de comprendre pourquoi le composant de décodeur ne décodait pas '+' correctement. Voici un extrait:

String:                         "A + B"
Expected Query String Encoding: "A+%2B+B"
escape("A + B") =               "A%20+%20B"     Wrong!
encodeURI("A + B") =            "A%20+%20B"     Wrong!
encodeURIComponent("A + B") =   "A%20%2B%20B"   Acceptable, but strange

Encoded String:                 "A+%2B+B"
Expected Decoding:              "A + B"
unescape("A+%2B+B") =           "A+++B"       Wrong!
decodeURI("A+%2B+B") =          "A+++B"       Wrong!
decodeURIComponent("A+%2B+B") = "A+++B"       Wrong!

encodeURIComponent ne Code pas -_.!~*'() , ce qui cause des problèmes dans l'affichage des données à php dans la chaîne xml.

par exemple:

<xml><text x="100" y="150" value="It's a value with single quote" /> </xml>

Général s'échapper avec encodeURI

%3Cxml%3E%3Ctext%20x=%22100%22%20y=%22150%22%20value=%22It's%20a%20value%20with%20single%20quote%22%20/%3E%20%3C/xml%3E

vous pouvez voir, une seule citation n'est pas encodée. Pour résoudre le problème j'ai créé deux fonctions pour résoudre le problème dans mon projet, pour encoder URL:

function encodeData(s:String):String{
    return encodeURIComponent(s).replace(/\-/g, "%2D").replace(/\_/g, "%5F").replace(/\./g, "%2E").replace(/\!/g, "%21").replace(/\~/g, "%7E").replace(/\*/g, "%2A").replace(/\'/g, "%27").replace(/\(/g, "%28").replace(/\)/g, "%29");
}

Pour le décodage de L'URL:

function decodeData(s:String):String{
    try{
        return decodeURIComponent(s.replace(/\%2D/g, "-").replace(/\%5F/g, "_").replace(/\%2E/g, ".").replace(/\%21/g, "!").replace(/\%7E/g, "~").replace(/\%2A/g, "*").replace(/\%27/g, "'").replace(/\%28/g, "(").replace(/\%29/g, ")"));
    }catch (e:Error) {
    }
    return "";
}

encodeURI () - la fonction escape () est pour l'échappement javascript, PAS HTTP.

Small comparison table Java vs. JavaScript vs. PHP.

1. Java URLEncoder.encode (using UTF8 charset)
2. JavaScript encodeURIComponent
3. JavaScript escape
4. PHP urlencode
5. PHP rawurlencode

char   JAVA JavaScript --PHP---
[ ]     +    %20  %20  +    %20
[!]     %21  !    %21  %21  %21
[*]     *    *    *    %2A  %2A
[']     %27  '    %27  %27  %27 
[(]     %28  (    %28  %28  %28
[)]     %29  )    %29  %29  %29
[;]     %3B  %3B  %3B  %3B  %3B
[:]     %3A  %3A  %3A  %3A  %3A
[@]     %40  %40  @    %40  %40
[&]     %26  %26  %26  %26  %26
[=]     %3D  %3D  %3D  %3D  %3D
[+]     %2B  %2B  +    %2B  %2B
[$]     %24  %24  %24  %24  %24
[,]     %2C  %2C  %2C  %2C  %2C
[/]     %2F  %2F  /    %2F  %2F
[?]     %3F  %3F  %3F  %3F  %3F
[#]     %23  %23  %23  %23  %23
[[]     %5B  %5B  %5B  %5B  %5B
[]]     %5D  %5D  %5D  %5D  %5D
----------------------------------------
[~]     %7E  ~    %7E  %7E  ~
[-]     -    -    -    -    -
[_]     _    _    _    _    _
[%]     %25  %25  %25  %25  %25
[\]     %5C  %5C  %5C  %5C  %5C
----------------------------------------
char  -JAVA-  --JavaScript--  -----PHP------
[ä]   %C3%A4  %C3%A4  %E4     %C3%A4  %C3%A4
[ф]   %D1%84  %D1%84  %u0444  %D1%84  %D1%84

se rappeler aussi qu'ils encodent tous des ensembles différents de caractères, et sélectionnez celui dont vous avez besoin de manière appropriée. encodeURI () Code moins de caractères que encodeURIComponent (), qui Code moins de caractères (et aussi différents, au point de dannyp) que escape ().

je recommande de ne pas utiliser une de ces méthodes est. Écrire votre propre fonction qui fait la bonne chose.

MDN a donné un bon exemple sur le codage d'url montré ci-dessous.

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).
        // Note that although RFC3986 reserves "!", RFC5987 does not,
        // so we do not need to escape it
        replace(/['()]/g, escape). // i.e., %27 %28 %29
        replace(/\*/g, '%2A').
            // 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, unescape);
}

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent

pour encoder javascript a donné trois fonctions intégrées -

1. escape () - ne Code pas @*/+ Cette méthode est dépréciée après L'ECMA 3 et doit donc être évitée.

2. encodeURI() - ne Code pas ~!@#$&*()=:/,;?+' Il suppose que L'URI est un URI complet, donc ne Code pas les caractères réservés qui ont une signification particulière dans L'URI. Cette méthode est utilisée lorsque l' l'intention est de convertir L'URL complète au lieu de quelque segment spécial de L'URL. Exemple - encodeURI('http://stackoverflow.com'); donnera - http://stackoverflow.com

3. encodeURIComponent() -ne pas coder - _ . ! ~ * ' ( ) Cette fonction code un élément D'Identificateur de Ressource uniforme (URI) en remplaçant chaque instance de certains caractères par une, deux, trois ou quatre séquences d'échappement représentant l'encodage UTF-8 du caractère. Cette méthode devrait être utilisé pour convertir un composant D'URL. Par exemple, certaines entrées de l'utilisateur doivent être ajoutées Exemple - encodeURI('http://stackoverflow.com'); donnera - http%3A%2F%2Fstackoverflow.com

tout ce codage est effectué en UTF 8 I. e les caractères seront convertis au format UTF-8.

encodeURIComponent diffèrent de encodeURI en ce qu'il encode les caractères réservés et signe dièse # de encodeURI

j'ai constaté que l'expérimentation avec les différentes méthodes est un bon contrôle de santé mentale, même après avoir eu une bonne poignée de ce que leurs diverses utilisations et capacités sont.

à cette fin, j'ai trouvé ce site web extrêmement utile pour confirmer mes soupçons que je fais quelque chose de manière appropriée. Il s'est également avéré utile pour décoder une chaîne encodeURIComponent'ed qui peut être assez difficile à interpréter. Un grand signet avoir:

http://www.the-art-of-web.com/javascript/escape /

j'ai cette fonction...

var escapeURIparam = function(url) {
    if (encodeURIComponent) url = encodeURIComponent(url);
    else if (encodeURI) url = encodeURI(url);
    else url = escape(url);
    url = url.replace(/\+/g, '%2B'); // Force the replacement of "+"
    return url;
};

la réponse acceptée est bonne. Étendre sur la dernière partie:

noter que le composant d'encodeur n'échappe pas au caractère'. Commun bug est de l'utiliser pour créer des attributs html tels que href = 'MyUrl', qui pourraient subir une injection de bug. Si vous construisez html à partir de chaînes de caractères, Utilisez "au lieu de" pour les guillemets d'attribut, ou ajoutez un couche supplémentaire d'encodage ('peut être encodé en tant que %27).

si vous pour être sur le côté sûr, pourcentage encodant les caractères sans réserve devrait être encodé aussi.

vous pouvez utiliser cette méthode pour les échapper (source Mozilla )

function fixedEncodeURIComponent(str) {
  return encodeURIComponent(str).replace(/[!'()*]/g, function(c) {
    return '%' + c.charCodeAt(0).toString(16);
  });
}

// fixedEncodeURIComponent("'") --> "%27"

réécriture moderne de la réponse de @johann-echavarria:

console.log(
    Array(256)
        .fill()
        .map((ignore, i) => String.fromCharCode(i))
        .filter(
            (char) =>
                encodeURI(char) !== encodeURIComponent(char)
                    ? {
                          character: char,
                          encodeURI: encodeURI(char),
                          encodeURIComponent: encodeURIComponent(char)
                      }
                    : false
        )
)

ou si vous pouvez utiliser un tableau, remplacer console.log par console.table (pour la sortie plus jolie).