Question Quand êtes-vous censé utiliser escape au lieu de encodeURI / encodeURIComponent?


Lors de l'encodage d'une chaîne de requête à envoyer à un serveur Web - quand utilisez-vous escape() et quand utilisez-vous encodeURI() ou encodeURIComponent():

Utilisez l'échappement:

escape("% +&=");

OU

utilisez encodeURI () / encodeURIComponent ()

encodeURI("http://www.google.com?var1=value1&var2=value2");

encodeURIComponent("var1=value1&var2=value2");

1283
2017-09-16 19:24


origine


Réponses:


échapper()

Ne l'utilisez pas! escape() est défini dans la section B.2.1.2 échapper et le texte d'introduction de l'annexe B dit:

... Toutes les caractéristiques et tous les comportements de la langue spécifiés dans cette annexe ont une ou plusieurs caractéristiques indésirables et, en l'absence d'utilisation antérieure, seraient supprimés de cette spécification. ...
  ... Les programmeurs ne devraient pas utiliser ou supposer l'existence de ces caractéristiques et comportements lors de l'écriture d'un nouveau code ECMAScript ....

Comportement:

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

Les caractères spéciaux sont codés à l'exception de: @ * _ + -. /

La forme hexadécimale pour les caractères, dont la valeur de l'unité de code est 0xFF ou moins, est une séquence d'échappement à deux chiffres: %xx.

Pour les caractères avec une unité de code supérieure, le format à quatre chiffres %uxxxx est utilisé. Ceci n'est pas autorisé dans une chaîne de requête (comme défini dans RFC3986):

query       = *( pchar / "/" / "?" )
pchar         = unreserved / pct-encoded / sub-delims / ":" / "@"
unreserved    = ALPHA / DIGIT / "-" / "." / "_" / "~"
pct-encoded   = "%" HEXDIG HEXDIG
sub-delims    = "!" / "$" / "&" / "'" / "(" / ")"
              / "*" / "+" / "," / ";" / "="

Un signe de pourcentage n'est autorisé que s'il est directement suivi de deux hexdigits, pourcentage suivi de u n'est pas autorisé.

encodeURI ()

Utilisez encodeURI lorsque vous voulez une URL de travail. Faites cet appel:

encodeURI("http://www.example.org/a file with spaces.html")

obtenir:

http://www.example.org/a%20file%20with%20spaces.html

N'appelez pas encodeURIComponent puisqu'il détruirait l'URL et retournerait

http%3A%2F%2Fwww.example.org%2Fa%20file%20with%20spaces.html

encodeURIComponent ()

Utilisez encodeURIComponent lorsque vous souhaitez coder la valeur d'un paramètre d'URL.

var p1 = encodeURIComponent("http://example.org/?a=12&b=55")

Ensuite, vous pouvez créer l'URL dont vous avez besoin:

var url = "http://example.net/?param1=" + p1 + "&param2=99";

Et vous obtiendrez cette URL complète:

http://example.net/?param1=http%3A%2F%2Fexample.org%2F%Ffa%3D12%26b%3D55&param2=99

Notez que encodeURIComponent n'échappe pas au ' personnage. Un bug commun est de l'utiliser pour créer des attributs html tels que href='MyUrl', qui pourrait souffrir d'un bug d'injection. Si vous construisez html à partir de chaînes, utilisez " au lieu de ' pour les citations d'attribut, ou ajouter une couche supplémentaire d'encodage (' peut être codé en% 27).

Pour plus d'informations sur ce type de codage, vous pouvez vérifier: http://en.wikipedia.org/wiki/Percent-encoding


1813
2018-05-24 06:54



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

Table with the ten differences between encodeURI and encodeURIComponent

J'ai généré cette table facilement avec console.table 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);


390
2017-10-09 09:26



J'ai trouvé cet article édifiant: Javascript Madness: le traitement des chaînes de requête

Je l'ai trouvé quand j'essayais de comprendre pourquoi decodeURIComponent 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!

43
2018-05-08 07:51



encodeURIComponent ne code pas -_.!~*'(), ce qui pose un problème lors de la publication de données dans php dans une chaîne XML.

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

Évasion générale 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, devis unique n'est pas codé. Pour résoudre le problème, j'ai créé deux fonctions pour résoudre le problème dans mon projet, pour l'URL de codage:

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 l'URL de décodage:

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 "";
}

37
2017-09-16 19:26



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


36
2017-10-08 15:20



Petite table de comparaison 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

14
2017-09-16 19:40



Souvenez-vous également qu'ils encodent tous des ensembles de caractères différents et sélectionnez celui dont vous avez besoin. encodeURI () encode moins de caractères que encodeURIComponent (), qui code moins (et aussi différent, au point de dannyp) que escape ().


10
2018-04-23 16:54



Je recommande de ne pas utiliser une de ces méthodes en l'état. Écrivez votre propre fonction qui fait la bonne chose.

MDN a donné un bon exemple sur l'encodage 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


9
2018-04-21 07:55



Pour l'encodage javascript a donné trois fonctions intégrées -

  1. escape () - ne code pas @*/+ Cette méthode est déconseillée après l'ECMA 3 donc il devrait être évité.

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

  3. encodeURIComponent () n'encode pas - _ . ! ~ * ' ( ) Cette fonction code un composant URI (Uniform Resource Identifier) ​​en remplaçant chaque occurrence de certains caractères par une, deux, trois ou quatre séquences d'échappement représentant le codage UTF-8 du caractère. Cette méthode devrait être utilisée pour convertir un composant d'URL. Par exemple, certaines entrées utilisateur doivent être ajoutées Exemple - encodeURI('http://stackoverflow.com'); donnera - http% 3A% 2F% 2Fstackoverflow.com

Tout ce codage est effectué en UTF 8, c'est-à-dire que les caractères seront convertis au format UTF-8. 

encodeURIComponent diffère de encodeURI en ce qu'il code les caractères réservés et le numéro de signe # de l'encodageURI


5
2017-08-08 12:34



J'ai trouvé qu'expérimenter avec les différentes méthodes est une bonne vérification même après avoir bien compris leurs différentes utilisations et capacités.

Vers cette fin, j'ai trouvé ce site extrêmement utile pour confirmer mes soupçons que je fais quelque chose de façon appropriée. Il s'est également avéré utile pour décoder une chaîne encodeURIComponent'ed qui peut être plutôt difficile à interpréter. Un bon marque-page à avoir:

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


3
2018-06-21 12:39