Quelle est la différence entre decodeURIComponent et decodeURI?

363

Quelle est la différence entre les fonctions JavaScript decodeURIComponentet decodeURI?

javascript Jon Tackabury
la source

Réponses:

398

Pour expliquer la différence entre ces deux, permettez-moi d'expliquer la différence entre encodeURIet encodeURIComponent.

La principale différence est que:

  • La encodeURIfonction est destinée à être utilisée sur l'URI complet.
  • La encodeURIComponentfonction est destinée à être utilisée sur .. eh bien .. les composants URI qui sont n'importe quelle partie située entre les séparateurs (; /?: @ & = + $, #).

Ainsi, dans encodeURIComponentces séparateurs sont codés également parce qu'ils sont considérés comme du texte et non des caractères spéciaux.

Revenons maintenant à la différence entre les fonctions de décodage, chaque fonction décode les chaînes générées par son équivalent de codage correspondant en prenant soin de la sémantique des caractères spéciaux et de leur traitement.

MahdeTo
la source
4
Une autre différence essentielle est que unescape ne gère pas les séquences UTF-8 multi-octets alors que decodeURI [Component] le fait:decodeURIComponent("%C3%A9") == "é"; unescape("%C3%A9") == "é";
chris
À
mon humble avis
114

encodeURIComponent / decodeURIComponent () est presque toujours la paire que vous souhaitez utiliser, pour concaténer ensemble et séparer les chaînes de texte dans les parties URI.

encodeURI en moins commun et trompeusement nommé: il devrait vraiment s'appeler fixBrokenURI. Il prend quelque chose qui est presque un URI, mais contient des caractères non valides tels que des espaces, et le transforme en un vrai URI. Il a une utilisation valide pour réparer les URI invalides à partir de l'entrée utilisateur, et il peut également être utilisé pour transformer un IRI (URI avec des caractères Unicode nus en) en URI ordinaire (en utilisant UTF-8 à% échappé pour coder le code non ASCII ).

decodeURI décode les mêmes caractères que decodeURIComponent à l'exception de quelques caractères spéciaux. Il est fourni pour être un inverse de encodeURI, mais vous ne pouvez toujours pas compter sur lui pour retourner le même que celui que vous aviez mis à l'origine - voir par exemple. decodeURI(encodeURI('%20 '));.

Là où encodeURI doit vraiment être nommé fixBrokenURI (), decodeURI () pourrait également être appelé potentiellementBreakMyPreviouslyWorkingURI (). Je ne peux penser à aucune utilisation valable pour cela n'importe où; éviter.

bobince
la source
11
decodeURI (encodeURI ('% 20')) donne '% 20' correctement dans ie, chrome et firefox, vous vous demandez simplement à partir de quel navigateur / version le résultat incorrect que vous avez observé?
ccppjava
1
Peut-être ont été cassés en 2009, mais le navigateur moderne a rattrapé en attendant (je suppose).
WoodrowShigeru
68 
js> s = "http://www.example.com/string with + and ? and & and spaces";
http://www.example.com/string with + and ? and & and spaces
js> encodeURI(s)
http://www.example.com/string%20with%20+%20and%20?%20and%20&%20and%20spaces
js> encodeURIComponent(s)
http%3A%2F%2Fwww.example.com%2Fstring%20with%20%2B%20and%20%3F%20and%20%26%20and%20spaces

On dirait que encodeURIproduit un URI "sûr" en codant les espaces et certains autres caractères (par exemple non imprimables), tandis que le encodeURIComponentcode deux-points et la barre oblique et les caractères plus sont également utilisés et sont destinés à être utilisés dans les chaînes de requête. L'encodage de + et? et & est particulièrement important ici, car ce sont des caractères spéciaux dans les chaînes de requête.

Jason S
la source
30

Comme j'avais la même question, mais que je n'ai pas trouvé la réponse ici, j'ai fait quelques tests afin de comprendre quelle était la différence. Je l'ai fait, car j'ai besoin de l'encodage pour quelque chose, qui n'est pas lié à l'URL / URI.

  • encodeURIComponent("A") renvoie "A", il ne code pas "A" en "% 41"
  • decodeURIComponent("%41") renvoie "A".
  • encodeURI("A") renvoie "A", il ne code pas "A" en "% 41"
  • decodeURI("%41") renvoie "A".

-Cela signifie que les deux peuvent décoder les caractères alphanumériques, même s'ils ne les ont pas encodés. Toutefois...

  • encodeURIComponent("&") renvoie "% 26".
  • decodeURIComponent("%26") Retour "&".
  • encodeURI("&") Retour "&".
  • decodeURI("%26") renvoie "% 26".

Même si encodeURIComponent ne code pas tous les caractères, decodeURIComponent peut décoder n'importe quelle valeur entre% 00 et% 7F.

Remarque: Il semble que si vous essayez de décoder une valeur supérieure à% 7F (sauf s'il s'agit d'une valeur unicode), votre script échouera avec une "erreur URI".

Kul-Tigin
la source
Remarque: Il y a une faute de frappe dans le premier decodeURIComponent (m au lieu de n). Je ne peux pas le corriger, car je dois modifier au moins 6 caractères.
SuperNova
23

encodeURIComponent()

Convertit l'entrée en une chaîne codée URL

encodeURI()

L'URL encode l'entrée, mais suppose qu'une URL complète est donnée, donc renvoie une URL valide en n'encodant pas le protocole (par exemple http: // ) et le nom d'hôte (par exemple www.stackoverflow.com ).

decodeURIComponent()et decodeURI()sont l'opposé de ce qui précède

Russ Cam
la source
12

decodeURIComponent décode les marqueurs spéciaux URI tels que &,?, #, etc., decodeURI non.

Bjorn
la source