Question Encoder l'URL en JavaScript?


Comment coder en toute sécurité une URL en utilisant JavaScript de manière à ce qu'elle puisse être placée dans une chaîne GET?

var myUrl = "http://example.com/index.html?param=1&anotherParam=2";
var myOtherUrl = "http://example.com/index.html?url=" + myUrl;

Je suppose que vous devez encoder le myUrl variable sur cette deuxième ligne?


2121
2017-12-02 02:37


origine


Réponses:


Découvrez la fonction intégrée encodeURIComponent(str) et encodeURI(str).
Dans votre cas, cela devrait fonctionner:

var myOtherUrl = 
       "http://example.com/index.html?url=" + encodeURIComponent(myUrl);

2489
2017-12-02 02:43



Vous avez trois options:

  • escape() ne codera pas: @*/+

  • encodeURI() ne codera pas: ~!@#$&*()=:/,;?+'

  • encodeURIComponent() ne codera pas: ~!*()'

Mais dans votre cas, si vous voulez passer un URL dans une GET paramètre de l'autre page, vous devez utiliser escape ou encodeURIComponent, mais non encodeURI.

Voir la question sur le dépassement de pile Meilleure pratique: escape, ou encodeURI / encodeURICcomposant pour plus de discussion.


1373
2017-12-02 02:49



Rester avec encodeURIComponent(). La fonction encodeURI() ne prend pas la peine d'encoder de nombreux caractères qui ont une importance sémantique dans les URL (par exemple "#", "?" et "&"). escape() est déconseillé, et ne prend pas la peine d'encoder les caractères "+", qui seront interprétés comme des espaces codés sur le serveur (et, comme indiqué par d'autres ici, n'encode pas correctement les caractères non-ASCII).

Il y a une belle explication de la différence entre encodeURI() et encodeURIComponent() autre part. Si vous souhaitez coder quelque chose afin qu'il puisse être inclus en toute sécurité en tant que composant d'un URI (par exemple, en tant que paramètre de chaîne de requête), vous souhaitez utiliser encodeURIComponent().


156
2018-05-29 23:54



Personnellement, je trouve que de nombreuses API veulent remplacer "" par "+" donc j'utilise ce qui suit:

encodeURIComponent(value).replace(/%20/g,'+');

escape est implémenté différemment dans différents navigateurs et encodeURI n'encode pas la plupart des caractères qui sont fonctionnels dans un URI (comme # et even /) - il est fait pour être utilisé sur un URI / URL complet sans le casser.

REMARQUE: Vous utilisez codecodeURIC pour le valeurs de la chaîne de requête (pas les noms de champs / valeurs et certainement pas l'URL entière). Si vous le faites d'une autre manière, il n'encodera pas les caractères comme =,?, &, Laissant éventuellement votre chaîne de requête exposée.

Exemple:

const escapedValue = encodeURIComponent(value).replace(/%20/g,'+');
const url = 'http://example.com/?myKey=' + escapedValue;

66
2017-12-15 08:47



Si vous utilisez jQuery je voudrais aller pour $.param méthode. Il URL code un champ de mappage d'objet à des valeurs, ce qui est plus facile à lire que d'appeler une méthode d'échappement sur chaque valeur.

$.param({a:"1=2", b:"Test 1"}) // gets a=1%3D2&b=Test+1

35
2018-05-13 03:32



Pour encoder une URL, comme cela a déjà été dit, vous avez deux fonctions:

encodeURI()

et

encodeURIComponent()

La raison en est que le premier préserve l'URL avec le risque de laisser trop de choses non échappées, tandis que le second encode tout ce qui est nécessaire.

Avec le premier, vous pourriez copier l'URL nouvellement échappée dans la barre d'adresse (par exemple) et cela fonctionnerait. Cependant, vos '&' non échappés interfèreraient avec les délimiteurs de champs, les '=' interféreraient avec les noms de champs et les valeurs, et les '+' ressembleraient à des espaces. Mais pour les données simples lorsque vous voulez préserver la nature de l'URL de ce que vous évadez, cela fonctionne.

La seconde est tout ce que vous devez faire pour vous assurer que rien dans votre chaîne n'interfère avec une URL. Il laisse inchangé divers caractères sans importance afin que l'URL reste aussi lisible que possible sans interférence. Une URL encodée de cette façon ne fonctionnera plus comme une URL sans la déconnecter.

Donc, si vous pouvez prendre le temps, vous voulez toujours utiliser encodeURIComponent () - avant d'ajouter des paires nom / valeur, encoder à la fois le nom et la valeur en utilisant cette fonction avant de l'ajouter à la chaîne de requête.

J'ai du mal à trouver des raisons d'utiliser l'encodage () - je vais laisser ça aux gens plus intelligents.


8
2018-01-26 21:31



encodeURIComponent () est le chemin à parcourir.

var myOtherUrl = "http://example.com/index.html?url=" + encodeURIComponent(myUrl);

MAIS vous devez garder à l'esprit qu'il existe de petites différences de la version php urlencode () et que @CMS mentionné, il n'encodera pas tous les caractères. Les gars à http://phpjs.org/functions/urlencode/ fait js équivalent à phpencode ():

function urlencode(str) {
  str = (str + '')
    .toString();

  // Tilde should be allowed unescaped in future versions of PHP (as reflected below), but if you want to reflect current
  // PHP behavior, you would need to add ".replace(/~/g, '%7E');" to the following.
  return encodeURIComponent(str)
    .replace(/!/g, '%21')
    .replace(/'/g, '%27')
    .replace(/\(/g, '%28')
    .
  replace(/\)/g, '%29')
    .replace(/\*/g, '%2A')
    .replace(/%20/g, '+');
}

7
2017-10-01 08:03



Genre similaire de chose que j'ai essayé avec le javascript normal

function fixedEncodeURIComponent(str){
     return encodeURIComponent(str).replace(/[!'()]/g, escape).replace(/\*/g, "%2A");
}

4
2018-01-05 18:49



Pour éviter le double encodage, il est recommandé de décoder l'url avant de l'encoder (par exemple, si vous utilisez des URL entrées par l'utilisateur, qui pourraient être déjà codées).

Disons que nous avons abc%20xyz 123 en entrée (un espace est déjà encodé):

encodeURI("abc%20xyz 123")            //   wrong: "abc%2520xyz%20123"
encodeURI(decodeURI("abc%20xyz 123")) // correct: "abc%20xyz%20123"

3
2018-06-22 03:28