0

How do I go on about protecting my api keys in my react app ? Do I set something up with express ? I'm trying my best to avoid building anything on the server myself to make the API calls from there. I am solely using firebase as my backend but I am making use of certain services such as emailjs. Is there anyway to make this call to emailjs without exposing it in my client code, without doing anything on my own server ? Emailjs does not offer any encrypting or whitelisting.

emailjs.init("API_KEY");
john-raymon
  • 306
  • 1
  • 7
  • 20
  • The only way is to keep them on server and make requests from there. Nothing sent to client is safe – charlietfl Aug 07 '17 at 17:48
  • So even though I am trying to solely use firebase as my backend, I will still have to create something using php to make those API calls for me ? – john-raymon Aug 07 '17 at 17:50
  • 1
    Can't you set up [environment vars in Firebase](https://firebase.google.com/docs/functions/config-env)? – Andy Aug 07 '17 at 18:01
  • Just make a little middleware, it's not very hard. You tell the app to use it, when requests come in it adds the `API_KEY` and the data stays on your server. The value should never make it to the users browser and you have no way of protecting it if it does. Are the users authenticated? You should probably have CSRF protection on this request anyway which will require you to do express middleware. – evanmcdonnal Aug 07 '17 at 18:06
  • I don't think you should do this in client side code at all. If you need to gain read access in client side code, try to see if they provide publishable key. – Tianhao Zhou Aug 07 '17 at 18:33
  • @evanmcdonnal are there any examples or guides that show you how to create this middleware to work with my React app ? Not very experienced in creating API's or any thing with express. – john-raymon Aug 07 '17 at 19:35
  • Possible duplicate of [Is there anyway to secure API keys in React JS, even though it's on the client side?](https://stackoverflow.com/questions/45530345/is-there-anyway-to-secure-api-keys-in-react-js-even-though-its-on-the-client-s) – Dave Powers Nov 09 '17 at 18:36

1 Answers1

2

You should use Firebase Functions to make your API calls since you are already using firebase. See here: https://firebase.google.com/docs/functions/use-cases#integrate_with_third-party_services_and_apis

Carlos Henriquez
  • 126
  • 5