Encoder L'URL en JavaScript?

comment encoder 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 la variable myUrl sur cette deuxième ligne?

2168
demandé sur ProgramFOX 2008-12-02 05:37:08
la source

13 ответов

Vérifiez 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);
2531
répondu Buu Nguyen 2011-09-29 14:01:37
la source

vous avez trois options:

  • escape() n'encodera pas: @*/+

  • encodeURI() n'encodera pas: [email protected]#$&*()=:/,;?+'

  • encodeURIComponent() n'encodera pas: ~!*()'

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

Voir Débordement de Pile question Meilleure pratique: la fuite, ou encodeURI / encodeURIComponent pour de plus amples discussions.

1393
répondu CMS 2017-05-23 15:02:48
la source

Bâton avec encodeURIComponent() . La fonction encodeURI() ne prend pas la peine d'encoder de nombreux caractères qui ont une importance sémantique dans les URLs (par exemple"#","?", et.)"&" escape() est déprécié, 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 souligné par d'autres ici, ne fait pas correctement URL-encoder les caractères non-ASCII).

Il y a une belle l'explication de la différence entre encodeURI() et encodeURIComponent() ailleurs. Si vous voulez encoder quelque chose pour qu'il puisse être inclus en toute sécurité comme un composant D'un URI (par exemple comme un paramètre de chaîne de requête), vous voulez utiliser encodeURIComponent() .

158
répondu Mike Brennan 2017-05-23 15:02:48
la source

personnellement, je trouve que beaucoup D'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 même /) -- il est fait pour être utilisé sur un URI/URL complet sans le casser.

NOTE : vous utilisez encodeURIComponent pour les valeurs dans la query string (pas de noms de champs/valeurs et certainement pas L'URL entière). Si vous le faites d'une autre façon, il ne sera pas encoder des caractères comme=,?,&, laissant peut-être votre chaîne de requête exposée.

exemple:

const escapedValue = encodeURIComponent(value).replace(/%20/g,'+');
const url = 'http://example.com/?myKey=' + escapedValue;
66
répondu Ryan Taylor 2018-09-26 20:53:06
la source

si vous utilisez jQuery, j'opterais pour la méthode $.param . Cette URL code un champ de mappage d'objet en 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
répondu Maksym Kozlenko 2014-05-26 02:55:43
la source

pour encoder une URL, comme il a été dit plus haut, vous avez deux fonctions:

encodeURI()

et

encodeURIComponent()

la raison pour laquelle les deux existent est que le premier préserve L'URL avec le risque de laisser trop de choses sans enregistrement, 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, votre &'s Non escapade interférerait avec les délimiteurs de champs, le '='s interférerait avec les noms et les valeurs des champs, et le '+'s ressemblerait à des espaces. Mais pour des données simples quand vous voulez préserver la nature URL de ce que vous échappez, cela fonctionne.

la seconde est tout ce que vous devez faire pour vous assurer que rien dans votre chaîne interfère avec une URL. Il laisse divers caractères sans importance de sorte que l'URL reste aussi lisible que possible sans interférence. Une URL encodée de cette façon ne sera pas travailler plus longtemps en tant QU'URL sans l'enlever.

donc si vous pouvez prendre le temps, vous voulez toujours utiliser encodeURIComponent() -- avant d'ajouter des paires nom/valeur encodent à 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'encodeURI() -- je laisse cela aux gens plus intelligents.

9
répondu Gerard ONeill 2017-01-27 00:31:43
la source

encodeURIComponent () est la voie à suivre.

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

mais vous devez garder à l'esprit qu'il y a de petites différences par rapport à la version php urlencode() et comme @CMS l'a mentionné, il n'encodera pas tous les char. Les gars de http://phpjs.org/functions/urlencode / made js equivalent à 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, '+');
}
8
répondu Adam Fischer 2018-09-01 08:11:25
la source

J'ai essayé avec javascript normal

function fixedEncodeURIComponent(str){
     return encodeURIComponent(str).replace(/[!'()]/g, escape).replace(/\*/g, "%2A");
}
4
répondu Narayan Yerrabachu 2013-05-14 12:01:41
la source

pour éviter le double encodage, il est conseillé de décoder l'url avant de l'encoder (si vous avez affaire à des URL saisies par l'utilisateur par exemple, qui pourraient être déjà encodées).

disons que nous avons abc%20xyz 123 comme 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
répondu serg 2017-01-05 21:49:48
la source

rien ne marchait pour moi. Tout ce que je voyais c'était le HTML de la page de connexion, revenant du côté client avec le code 200. (302 Au début, mais la même demande Ajax chargeant la page de connexion à l'intérieur D'une autre demande Ajax, qui était censée être une redirection plutôt que de charger du texte simple de la page de connexion).

dans le contrôleur de connexion, j'ai ajouté cette ligne:

Response.Headers["land"] = "login";

et dans le global Ajax handler, j'ai fait ceci:

$(function () {
    var $document = $(document);
    $document.ajaxSuccess(function (e, response, request) {
        var land = response.getResponseHeader('land');
        var redrUrl = '/login?ReturnUrl=' + encodeURIComponent(window.location);
        if(land) {
            if (land.toString() === 'login') {
                window.location = redrUrl;
            }
        }
    });
});

maintenant je n'ai plus de problème, et ça marche comme un charme.

2
répondu Asif Ashraf 2013-01-03 11:31:07
la source

chaîne D'URL D'encodage

    var url = $(location).attr('href'); //get current url
    //OR
    var url = 'folder/index.html?param=#23dd&noob=yes'; //or specify one

var encodedUrl = encodeURIComponent(url);
console.log(encodedUrl);
//outputs folder%2Findex.html%3Fparam%3D%2323dd%26noob%3Dyes


for more info go http://www.sitepoint.com/jquery-decode-url-string
1
répondu Sangeet Shah 2015-09-10 09:41:37
la source

vous pouvez utiliser la bibliothèque esapi et encoder votre url en utilisant la fonction ci-dessous. La fonction dure que '/' ne sont pas perdus pour l'encodage de tout le reste du contenu de texte est codé:

function encodeUrl(url)
{
    String arr[] = url.split("/");
    String encodedUrl = "";
    for(int i = 0; i<arr.length; i++)
    {
        encodedUrl = encodedUrl + ESAPI.encoder().encodeForHTML(ESAPI.encoder().encodeForURL(arr[i]));
        if(i<arr.length-1) encodedUrl = encodedUrl + "/";
    }
    return url;
}

https://www.owasp.org/index.php/ESAPI_JavaScript_Readme

0
répondu Mohith Maratt 2016-09-27 18:59:49
la source

qu'est-ce que L'encodage D'URL:

une URL doit être encodée lorsqu'il y a des caractères spéciaux à l'intérieur de l'URL. Par exemple:

console.log(encodeURIComponent('?notEncoded=&+'));

nous pouvons observer dans cet exemple que tous les caractères sauf la chaîne notEncoded sont encodés avec des signes%. L'encodage D'URL est aussi connu comme l'encodage de pourcentage parce qu'il échappe à tous les caractères spéciaux avec un %. Puis, après ce signe % chaque caractère spécial a un code unique

Pourquoi avons-nous besoin D'encodage D'URL:

certains caractères ont une valeur spéciale dans une chaîne D'URL. Par exemple, l' ? caractère indique le début d'une chaîne de requête. Afin de localiser avec succès une ressource sur le web, il est nécessaire de faire une distinction entre quand un caractère est conçu comme une partie de la chaîne de caractères ou une partie de la structure d'url.

comment réaliser L'encodage D'URL dans JS:

JS offre un tas de construire dans la fonction utilitaire que nous pouvons utiliser pour encoder facilement URL's. Ce sont deux options pratiques:

  1. encodeURIComponent() : prend un composant D'un URI comme argument et renvoie la chaîne d'URI encodée.
  2. encodeURI() : prend un URI comme argument et renvoie la chaîne d'URI encodée.

exemple et mises en garde:

ne pas passer dans toute L'URL (y compris scheme, E. G https://) en encodeURIComponent() . Cela peut en fait le transformer en une URL non fonctionnelle. Par exemple:

// for a whole URI don't use encodeURIComponent it will transform
// the / characters and the URL won't fucntion properly
console.log(encodeURIComponent("http://www.random.com/specials&char.html"));

// instead use encodeURI for whole URL's
console.log(encodeURI("http://www.random.com/specials&char.html"));

nous pouvons observer si nous mettons toute L'URL dans encodeURIComponent que les Foward slashes (/) sont également convertis en caractères spéciaux. Cela causera que L'URL ne fonctionne plus correctement.

donc (comme le nom l'indique) utiliser:

  1. encodeURIComponent sur une certaine partie d'une URL que vous souhaitez encoder.
  2. encodeURI sur une URL entière que vous voulez encoder.
0
répondu Willem van der Veen 2018-09-23 11:35:26
la source

Autres questions sur javascript encoding url