{
  "id": 4036365,
  "title": "Your NEXT_PUBLIC secret is already in the browser bundle",
  "url": "https://urgent.news/2026/08/28/your-next-public-secret-is-already-in-the-browser-bundle",
  "topic": "tech",
  "section": "Tech",
  "published": "2026-08-28T20:59:58.000Z",
  "source": {
    "name": "Dev.to",
    "slug": "dev-to",
    "url": "https://dev.to/veristria/your-nextpublic-secret-is-already-in-the-browser-bundle-2ige"
  },
  "original_language": "en",
  "account": "Secrets like Stripe API keys and OpenAI tokens can unintentionally end up in the client-side bundle of a Next.js application. When developers try to access these secrets in server components, the build process automatically strips them from the client bundle. However, a developer might mistakenly copy the secret from a server component to a client component, or import a shared utility that includes the secret. This results in the secret being included in the JavaScript that every visitor downloads, turning a server-only secret into a publicly exposed piece of information. Tools like KeyDrift can detect these unintentional leaks by scanning the client bundle for hard-coded secrets and environment variables. The scan cross-references each detected credential with the tool that introduced it, providing a clear report of the issue. To fix the problem, developers have several options: they can keep the secret on the server, call a server-side function from the client, or remove the NEXT_PUBLIC_ prefix for real secrets. After making these changes, it's crucial to run a KeyDrift scan to ensure the secret is no longer present in the client bundle. Preventing these leaks involves storing public keys and tokens separately from the server-side secrets, avoiding dynamic imports of server-side modules, and properly configuring build settings to avoid stale bundles that contain the leaked values.",
  "summary": "Problem In a Next.js app it’s easy to slip a secret (e.g., STRIPE_SECRET_KEY , OpenAI API key, Supabase JWT) into a client‑side bundle. When a server component reads process.env.STRIPE_SECRET_KEY it stays on the server, but copying that line into a client component causes the build to fail to resolve the variable. The common “quick fix”—renaming the variable with the NEXT_PUBLIC_ prefix—makes the…",
  "key_points": [],
  "editors_take": null,
  "illustration": null,
  "coverage": {
    "outlets": 1,
    "also_reported_by": []
  },
  "ai_generated": true,
  "disclaimer": "Summaries, key points and the editor’s take are written by software from other outlets’ reporting and may contain errors — always check the linked original."
}