React <Auth0Provider/>, how to pass params from server

Help
1

Please include the following information in your post:
I am following Auth0 React SDK for Single Page Apps instead of hard coding the domain and clientId I want to read it from server, how do I achieve it in react in

Currently, I am reading from express layer and I can console.log it in the app and everything is working fine BUT for some reason the params in Auth0Provider is not updating to the new variables from the server

                <Auth0Provider
                    domain={domain}
                    clientId={clientId}
                    redirectUri={redirecturi}
                >
  • Which SDK this is regarding:
    auth0-react
  • SDK Version:
    “@auth0/auth0-react”: “^1.10.0”,
  • Platform Version:
    node 12.22.x
3

Hi @arup.sarkar,

Why are you doing this? Usually you set them as environment variables.

4

I have a .env file in my local and eventually it will be hosted in heroku. Now my express layer can easily read up from .env and get process.env.domain or process.env.clientId. Auth0Provider being in client side I was reading it in my express, exposed it via endpoint and client calling the endpoint to get it. Basically, ensuring that none of it is exposed in client.
I found out that in react you can read environment variables Adding Custom Environment Variables | Create React App which I will try.

5

These variables (clientId, domain, redirectURI) are not confidential. A user can easily look at the URL and see your domain, right? All they need to do is inspect the request and all of these variables are available.

The client is running on the user’s machine, and there is no way to keep data in the client safe from the user. Make sure you aren’t storing secrets, API keys, etc. Even if you are retrieving them after the fact, they could still be inspected by the user.