Hide Google API Key

[William Spence]

I have 3 mobile apps and 3 desktop apps that use a Google Maps API Key. If these were to end up in the wild, it could cost me a pretty penny, and they are very easy to find. The problem is that they are very visible in a simple Google Maps html file that is in my local store directory. The HTML file has to be in that directory for my webview to be able to use it, so somehow I have to be able to hide the key and not the HTML file.

My first thought was to download the key from my database, and somehow inject it into my HTML file, but I have no clue how to "inject" a variable into my HTML. Plus, I would rather not write the key to my html file and save it on the computer. I wish I were able to figure out a way to "include" an external variable into my HTML, or use an environmental variable.

Has anyone else ran into a similar problem and have any suggestions as to how I might handle this?

[marchbold]

For your mobile apps at least you can restrict usage of the key to a certain bundle id / package name. This should stop anybody being able to use it in other scenarios.  

https://developers.google.com/maps/api-key-best-practices#restrict_apikey

[William Spence]

Thanks Michael.  I had read their guidelines, but when all is said and done, I will have 37 versions of my apps between Anroid, iOS, Windows, Mac, and the web, and that would be a lot of keys to set constraints on and maintain.

I think I found an acceptable solution. The webView ANE that you made allows me to talk with Javascript. So I download the Google API key from my database, pass it to the maps HTML file through Javascript, and everything works great. This way, my API key is never in any files on my users device, and I only have 1 key that I have to maintain. If somehow somebody ever actually got my API key, I could roll it over to a new one, but my apps would not break because the key is not hardwired into them.