Using Naver Maps API without the key

Today for work I investigated the implementation of South Korean maps for one of our clients, unfortunately Google Maps doesn’t currently have street level details and view in South Korea. I ended up having to look at maps.naver.com which seems to be the only decent free korean mapping site available on the Internet with an API as well. Unfortunately for me, I did not understand korean, google translate was unable to help me with the site and there was no english translation available. After scanning through the API (in Korean), I managed to make out how implement the code but it was impossible to register without understanding the 10 step registration process in order to get an API key to use the maps . . . anyway here’s how I got it working without the API key!

With some help from KoreaCrunch, I simply used his API key and altered the naverMap.naver javascript file to authenticate with that key. If you are impatient, simply view my demo below to see the implementation and view my altered version of naverMap.naver. You can view the original naverMap.naver here

Changes

Originally, I wanted to put a diff output of the two files but because the original code was slightly compressed and obfuscated it looked more messy so i’ll just extract the changes and roughly described what I changed. It took me only 15mins to crack this, much much longer than writing this blog article.

Line 11:

From

var dkh2 = this.uog0 + "?key=" + this.svbr6+"&uri=" + escape(document.location.href) + "&time="+now.getTime();

To

var dkh2 = this.uog0 + "?key=e34398d6bb4be7f1f2bb6ad323d96d55&uri="  + escape("http://channy.creation.net/work/map/naver_map_api.html") + "&time=" + now.getTime();

This change tells naver’s API key validate the API key which in this case is e34398d6bb4be7f1f2bb6ad323d96d55 and the page that its calling from. One would wonder why they did not check the http headers instead of accepting the current url as a parameter defined by the client!

Line 34:

From

{epvp2.src = this.spec.preTileUrl;}

To

{epvp2.src = jqa6;}

For some reason, it was retrieving the correct map image but does possibly some validation of sorts and updates epvp2.src with the correct map image url defined in jqa6. What I did here was simply assign epvp2.src to jqa6 rather that letting it be assigned the default background tile image at this.spec.preTileUrl

Here is the Demo based on KoreaCrunch’s code.

Credits

Thanks to naver.com for supplying a nice mapping system, hopefully an english version will appear soon for non-korean developers. Also thanks to KoreaCrunch who’s demo of the naver API proved priceless in my research.