Home > OS >  How to handle an API key in a React frontend without users having to login
How to handle an API key in a React frontend without users having to login

Time:02-05

I'm building a React frontend which calls several Azure Functions API's. Users don't have to login. Now I have a host key, which I include in the requests to the functions, but sending this api key to the client-side doesn't feel very secure. Now I know that I can use process.env, but that still isn't very secure I think.

Is there a way to do this securely?

Thanks!

CodePudding user response:

Simple rule: Nothing can be kept secret in an Angular/React SPA that is executed on the client side.

You could go down the path of server-side rendering of your React app, call the Azure Function API on a server and only return already rendered pages to the user. That way your users don't see keys but of course they still cause API calls with every page load.

  •  Tags:  
  • Related