Solved a bug today whilst encoding in JavaScript a URL that contained a certain special character: the hash character #.
I found a generated querystring was not working correctly because many of the params were not being passed to the server somehow. I was generating a link like so: var link = 'http://www.britishdeveloper.co.uk?link=' + encodeURI(url) + '&userID=232';
I was quite pleased with myself remembering to URL Encode params that are going into a querystring to get around special characters but I had not thought of something... the hash character #!
Say the url being placed in the querystring is '/my page.aspx#comment3'
my link was coming out as http://www.britishdeveloper.co.uk?link=/my%20page.aspx#comment3&userID=232
.
What's wrong with that?
Well it's not what I was expecting really but it was working up until I got urls with hashes in. As you may or may not know everything proceeding a # in a url is for browsers so your server will ignore everything after it. In this case the userID param was not seen by my server.
encodeURIComponent not encodeURI
For this particular scenario encodeURIComponent was what I needed since:
encodeURI('/my page.aspx#comment3') //output: /my%20page.aspx#comment2 encodeURIComponent('/my page.aspx#comment3') //output: %2Fmy%20page.aspx%23comment2
encodeURI is for encoding non-URI special characters from a string so the above example of encodeURI would have been great for appending it like so 'http://www.britishdeveloper.co.uk' + encodeURI(url)
encodeURIComponent is for encoding a string to be fit for a querystring param where characters such as . and # shouldn't really be included as in my above example.
So know your Javascript encoding!
Excellent read, I just passed this onto a colleague who was doing a little research on that.
ReplyDeletehow to write dissertation abstract
Very useful. Helped me solve exactly the same issue with "#" not encoding. Thanks
ReplyDeleteBrowsers are tooooo much clever this days. They catch my '#' even while it encoded to %23.
ReplyDeletePest Control services in Kirti Nagar
ReplyDeletePest Control services in Modi Nagar
Pest Control services in Patel Nagar
Pest Control services in Rajouri Garden
Pest Control services in Tilak Nagar
Pest Control services in Janakpuri
Pest Control services in Paschim Vihar
This is really awesome...I like your post and looking forward to it.Blackmart Apk free download market helper latest version freestore apk latest version
ReplyDeleteIndia's only Digital News Channel with True Voice of India.
ReplyDeleteFinding #Championsofchange2018 #rahulshivkant
the universal post teams
the universal post youtube
loksabha election 2018
top trending news
top viral news
best trending news in india
Hello, I log on to your blogs on a regular basis. Your writing style is witty, keep it up!
ReplyDeleteMenmyshop
Touch Hypersonic Double Din Player Mirror
J3L Touch Double Din Player
Hypersonic Double Din Player Mirror
J3L Double Din Player Mirror
Hyundai Xcent OEM Double Din Player
banzara
Movers and packers in mohali
ReplyDeletePatrachar Vidyalaya Admission Form
Patrachar Vidyalaya Shalimar Bagh
Open School admission
Cbse Patrachar
packer and mover chandigarh
ReplyDeletePackers and movers in panchkula
packers and movers in mohali
Thanks for your post! Through your pen I found the problem up interesting! I believe there are many other people who are interested in them just like me!
ReplyDeleteGeometrydashonline.net
Basketballlegendsgame.com
Nice Article
ReplyDeleteAbb Sockets Online
Industrial Plug Sockets online
Abb Switches Online
Abb Mounting Plates Online
Abb Manual Changeover Switches Online
Nice Article
ReplyDeleteBest Doctors in Faridabad
Best Doctors in Gurugram
Best Doctors in Ghaziabad
Best Doctors in Noida
Best Doctors in Delhi