geolocation - Concealing API key in Front End javascript

Question

I have a web application that requires user location.

I am using the Google GeoLocation API. Because this API returns the GeoLocation of the caller, I must call from the client side, which means I must give the client my API key. Obviously this opens me and my API key to potential abuse.

It would be ideal to have the backend make the actual call to the GeoLocation API, but I don't understand how that could be done, given the nature of the GeoLocation API.

Therefore, is there a way around this that would allow me conceal my Google API key, yet still allow the client to submit the request to the GeoLocation API?

Answer 1

You should whitelist your website domain for your production key so that it can only be called on your website.

Also setup API key restriction to only Map JavaScript API.

It can be done under credential tab of APIs and Services in your GCP console.