CODEWITHSUNDEEP
google-maps
stakutis
stakutis

Reputation: 47

How to secure/hide the API Key

I have a SPA that needs to do mapping and I want to use Google Maps API (which works great), but I dont want to have the API KEY in the java script because anyone can "view code" and steal it. I'm SURE this is a common problem/solution but I can't find anything to help; closest is something about using a Proxy. I'm sure everyone that uses Google API in a client-javascript-app has this problem...

Upvotes: 0

Views: 947

Answers (1)

Shawn Domingo
Shawn Domingo

Reputation: 1401

Since you've mentioned that you are gonna use the API in the client-side Javascript. You may use the HTTP referrer restriction, this will restrict your API key to be used only in your domain and will result error if your API key will be used under other domain. You may do this by following the steps below:

  1. Go to GCP Console Credentials Page
  2. On the list below, click on the name of the API key that you made.
  3. In the Application restrictions section, click on HTTP referrers.

  4. On the text box below, insert the following:

    example.com

    *.example.com

These two will allow your API key to be used in all subdomains and paths in your website.

  1. Then click on Save

NOTE : replace example.com with the domain that you intend to restrict.

Upvotes: 2

Related Questions