How to encode periods for URLs in Javascript?

Question

The SO post below is comprehensive, but all three methods described fail to encode for periods.

Post: Encode URL in JavaScript?

For instance, if I run the three methods (i.e., escape, encodeURI, encodeURIComponent), none of them encode periods.

So "food.store" comes out as "food.store," which breaks the URL. It breaks the URL because the Rails app cannot recognize the URL as valid and displays the 404 error page. Perhaps it's a configuration mistake in the Rails routes file?

What's the best way to encode periods with Javascript for URLs?

Answer 1

I had this same problem where my .htaccess was breaking input values with . Since I did not want to change what the .htaccess was doing I used this to fix it:

var val="foo.bar";
var safevalue=encodeURIComponent(val).replace(/\./g, '%2E');

this does all the standard encoding then replaces . with there ascii equivalent %2E. PHP automatically converts back to . in the $_REQUEST value but the .htaccess doesn't see it as a period so things are all good.

Answer 2

Periods shouldn't break the url, but I don't know how you are using the period, so I can't really say. None of the functions I know of encode the '.' for a url, meaning you will have to use your own function to encode the '.' .

You could base64 encode the data, but I don't believe there is a native way to do that in js. You could also replace all periods with their ASCII equivalent (%2E) on both the client and server side.

Basically, it's not generally necessary to encode '.', so if you need to do it, you'll need to come up with your own solution. You may want to also do further testing to be sure the '.' will actually break the url.

hth