Environment variables exposed on the client

[BenjaminWFox]

Bug report

Describe the bug

Environment variables which do not use the NEXT_PUBLIC_ prefix are inlined in built static files and exposed to the client despite the documentation seeming to suggest otherwise.

To Reproduce

Steps to reproduce the behavior, please provide code snippets or a repository:
Example repo: https://github.com/BenjaminWFox/nextjs-environment-variable-examples
Deployed app: https://nextjs-environment-variable-examples.vercel.app/

You can see that variable is inlined into the static .html: https://github.com/BenjaminWFox/nextjs-environment-variable-examples/blob/main/.next-demo/server/pages/index.html#L33

It appears that the intent is then to strip this out before the page is viewed on the client, but refreshing quickly or simulating a slow connection displays the variable prior to it being stripped out.

Expected behavior

I would expect that a static page would not be allowed to use non-public environment variables.

Screenshots

GIF shows the non-public variable visible on refreshing the page:

System information

• Browser [chrome]
• Version of Next.js: [9.5.5]
• Version of Node.js: [12.13.1 locally]

Additional context

I saw this while trying to better understand the behavior of environment variables generally, so not sure if there was something else I might be doing wrong.

[merodiro]

the reason it appears on the first render and then disappears when the page loads is that the first render is from the server/generated HTML where it has these all env variables available but it disappears when react hydrate finishes because the env isn't available in the client bundle

[BenjaminWFox]

I get that, but considering the docs it would be easy for someone to make a mistaken assumption about how safe their environment variables actually were. They are exposed to the browser, albeit briefly.

By default all environment variables loaded through .env.local are only available in the Node.js environment, meaning they won't be exposed to the browser.

So if not a bug maybe just a 'needs clarification'?

[BenjaminWFox]

In a similar vein, SSG files that use process.env.* values can use any value from the .env/.env.local file without requiring the NEXT_PUBLIC_ prefix.

I feels like I should get an error when building in this case, and be required to prefix any environment variables for SSG files with NEXT_PUBLIC_.