google-mapsjsfiddleapi-keycodepencode-sharing

Google Maps API Key Privacy


I am using Google Maps API v3. I have ran into some issues recently and I would like to share my code with others for debugging purposes, for example on JSfiddle, Codepen etc.

How can I do this without disclosing my API key?

Earlier versions of Google Maps API allowed me to simply include https://maps.googleapis.com/maps/api/js in the 'External Resources' panel, but this no longer works.


Solution

  • You may just simply restrict your API key to JSFiddle or Codepen via http referrers,for JSFiddle, the best practice would be:

    jsfiddle.net
    jshell.net
    *.jshell.net
    

    by doing this, it will allow you to use your API key freely in JSFiddle or Codepen, in case that the API key will be used in other sites, it will return a Degraded Experience, so you don't have to worry about unexpected usage.

    Please note that the http referrers above are for JSFiddle only as I haven't tried restricting for Codepen yet.

    You may also visit API key best practices to learn other methods of restricting API key.