How to encode URL parameters

Question

I am trying to pass parameters to a URL which looks like this  http   www foobar com foo imageurl   And I want to pass the parameters such as an image URL which is generated itself by another API  and the link for the image turns out as  http   www image com  username unknown amp password unknown  However  when I try to use the URL  http   www foobar com foo imageurl http   www image com  username unknown amp password unknown  It doesn t work  I have also tried using encodeURI   and encodeURIComponent   on the imageURL  and that too doesn t work

User · Answer

With urlsearchparams  const params   new URLSearchParams   params append  imageurl   http   www image com  username unknown amp password unknown  return  http   www foobar com foo   params toString

User · Answer

With PHP  echo urlencode  http   www image com  username unknown amp password unknown      Result  http 3A 2F 2Fwww image com 2F 3Fusername 3Dunknown 26password 3Dunknown   With Javascript   var myUrl    http   www image com  username unknown amp password unknown   var encodedURL   http   www foobar com foo imageurl     encodeURIComponent myUrl     DEMO  http   jsfiddle net Lpv53

User · Answer

Using new ES6 Object entries    it makes for a fun little nested map join    x000D   x000D  const encodeGetParams   p   gt   x000D    Object entries p  map kv   gt  kv map encodeURIComponent  join       join   amp     x000D   x000D  const params     x000D    user   Mar  a Rodr  guez   x000D    awesome  true  x000D    awesomeness  64  x000D     ZOMG  amp            GMOZ  x000D     x000D   x000D  console log  https   example com endpoint     encodeGetParams params   x000D   x000D   x000D

User · Answer

Just try encodeURI   and encodeURIComponent   yourself     x000D   x000D  console log encodeURIComponent        amp       x000D   x000D   x000D   Input        amp     Output   40 23 24 25 5E 26    So  wait  what happened to     Why wasn t this converted   TLDR  You actually want fixedEncodeURIComponent   and fixedEncodeURI     Long-story    You should not be using encodeURIComponent   or encodeURI     You should use fixedEncodeURIComponent   and fixedEncodeURI    according to the MDN Documentation  Regarding encodeURI       If one wishes to follow the more recent RFC3986 for URLs  which makes square brackets reserved  for IPv6  and thus not encoded when forming something which could be part of a URL  such as a host   the following code snippet may help    function fixedEncodeURI str    return encodeURI str  replace   5B g       replace   5D g           Regarding encodeURIComponent       To be more stringent in adhering to RFC 3986  which reserves             and     even though these characters have no formalized URI delimiting uses  the following can be safely used    function fixedEncodeURIComponent str    return encodeURIComponent str  replace          g  function c    return       c charCodeAt 0  toString 16          So  what is the difference   fixedEncodeURI   and fixedEncodeURIComponent   convert the same set of values  but fixedEncodeURIComponent   also converts this set             amp    This set is used in GET parameters   amp      etc    anchor tags      wildcard tags      email username parts      etc   For example -- If you use encodeURI    user example com  email me home will not properly send the second   to the server  except for your browser handling the compatibility  as Chrome naturally does often

[javascript] How to encode URL parameters?

Examples related to javascript

Examples related to url

Examples related to encodeuricomponent