2

I want to make a weather-forecast website and was planning to make AJAX requests to the openweathermap API to load the weather data.

However, I am uncertain on how to properly use the API key. I was going to include the key in a JS script, but I am concerned that the key might be "stolen" either from GitHub or the html source.

AFAIK the key can only be used to make weather data requests, but it could still be abused to make an inordinate number of requests.

Would including the key in the html file be a bad practice? If so, how would I properly implement it?

Sebastian Hietsch
  • 145
  • 1
  • 5

2 Answers2

2

If your website has a backend, you can create an endpoint in your own backend that fires off a request to OpenWeatherMap. That way you can store the key securely on your own server and the client needs never know about it.

If your website does not have a backend, you are going to have to give the client your key at some point so that it can make the request. It doesn't really matter how you pass it to the client, because at some point it will need to be sent to OpenWeatherMap from the client.

JonRB
  • 393
  • 1
  • 6
2

Proxy the request through your backend server retaining the API key secure stored in configuration on your server. Add CORs and set it up so the API is only able to be called from your site in the browser as well.

An API key is considered a secret and secrets should never be hard coded in a client as its trivial to extract them

McMatty
  • 3,270
  • 1
  • 9
  • 16