.env variables showing in HTML page source on React site
I got a site based on the React-Starter-Kit site running locally and online, I can log in and out of both.
I hosted the site at Vercel where I had to copy the variables in my local .env file into Settings>EnvironmentVariables and I changed the URL.
But I notice that when someone wants to find out my Kinde clientId from my env variables on my online site, they simply need to View Page Source, search for "clientId" and it is shown in plain text.
Can this be prevented, or is this just a security issue we have to live with unless we use a server-side solution like Next.js, etc.?
1 Reply
Hi Edward.
The client ID isn't necessarily the sensitive part of your Kinde application, it's the Client secret we want to make sure we never share.
A lot of tools and providers follow the pattern of having publishable keys (like the client ID in this case) and secret, sensitive keys - Stripe comes to mind.
If you'd prefer to avoid this issue altogether, you can offload auth to a server using a full-stack React framework like NextJS and use the relevant Kinde SDKs there, or opt to use Kinde with a dedicated backend of your choosing 🙂