← back

Escaping of backticks in urls and google maps

December 23, 2014
software development

In the FREEONTOUR application we’ve been working on we have a javascript application that allows users to build their own routes along POI’s and campsites. These routes become complex entities with sometimes more than 20 waypoints and custom route additions. The routes are searchable and it looks like this: routes index

To show an impression of the route we show a static google maps image with waypoints and a polyline. Like this:

The polyline is calculated everytime the user saves the route and stored in the database.

We noticed at one point that static images were not displayed in Firefox and after hours of research we found out that Firefox automatically escapes backticks in URL’s while Google Chrome and Internet Explorer do not. We do not URL encode the polyline (as this is already encoded) so the backticks were echo’d out to the URL of the image. However because the URL was signed server side, changing it afterwards generates an invalid signature and makes the request fail.

So to solve the problem: Escape backticks (and a few other characters) before signing the URL resulting in the same behaviour across all browsers.

Borderline of this short post: There is a difference across browsers where Firefox force URL encodes backticks while Chrome and IE don’t.

comments powered by Disqus