v0 app security: what to check
v0 by Vercel generates React and Next.js apps that deploy to Vercel. The generated code mixes server and client components, and the line between them decides what reaches the browser.
Anything used in a client component, and any environment variable starting with NEXT_PUBLIC_, ends up in the code every visitor downloads.
What to check on v0
-
Are secret API keys exposed in your front end?
A secret used in a client component, or given the NEXT_PUBLIC_ prefix, is built into the public bundle.
-
Which services and settings does your app expose?
Lists the environment variable names and services visible in the browser code.
-
Are your security headers set?
Headers are set in next.config.js or vercel.json and are often missing from generated projects.
-
Is your site publishing its source maps?
Worth confirming that production source maps are not published.
Where settings go on v0
- Security headers
- In Next.js, return the header from the headers() function in next.config.js (or next.config.ts) for the source "/(.*)"; on Vercel you can also add it under "headers" in vercel.json.
- Secret keys
- Variables starting with NEXT_PUBLIC_ are built into the public bundle. Rename the variable without that prefix and use it only in server code: a Route Handler, a Server Action or a server component.
Common questions
Which variables are public in a v0 app?
Every variable whose name starts with NEXT_PUBLIC_ is built into the browser code. Keep secrets without that prefix and use them only in server code.
Can I add security headers to a v0 app?
Yes, in next.config.js with the headers() function, or under "headers" in vercel.json.