Double Quote in ENV VAR cause 500 in NextJS production builds
verdverm opened this issue · 3 comments
Preliminary Checks
- I have reviewed the documentation: https://clerk.com/docs
- I have searched for existing issues: https://github.com/clerk/javascript/issues
- I have not already reached out to Clerk support via email or Discord (if you have, no need to open an issue here)
- This issue is not a question, general help request, or anything other than a bug report directly related to Clerk. Please ask questions in our Discord community: https://clerk.com/discord.
Reproduction
n/a
Publishable key
pk_test_bWFqb3ItZ29waGVyLTY0LmNsZXJrLmFjY291bnRzLmRldiQ
Description
Steps to reproduce:
- Production build of NextJS
- Have
"
end up in the ENV var
I deployed my production build to Kubernetes, and in the process of creating the secret from a .env file, the actual value contained the double quotes from the .env file in-cluster
From running env
in bash in the container
CLERK_SECRET_KEY="sk_test_6o..."
Expected behavior:
- A clearer error, if possible?
- detect and strip the quotes, more resilient
Actual behavior:
500 on the website homepage with little error context
I looked into chunk/167.js
and noticed clerk domains.
Eventually the atob
function was the breadcrumb that led to look at the values of the vars.
DOMException [InvalidCharacterError]: Invalid character
at new DOMException (node:internal/per_context/domexception:53:5)
at __node_internal_ (node:internal/util:695:10)
at atob (node:buffer:1330:13)
at u (/app/.next/server/chunks/167.js:1:797)
at /app/.next/server/chunks/167.js:1:991
at h (/app/.next/server/chunks/167.js:1:1040)
at t0 (/app/.next/server/chunks/167.js:5:44563)
at 14452 (/app/.next/server/chunks/452.js:1:1558)
at t (/app/.next/server/webpack-runtime.js:1:127)
at 50854 (/app/.next/server/chunks/13.js:1:10880)
[Error: An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error.] {
digest: '1890365856'
}
Environment
This is a `standalone` build...
In container:
System:
OS: Linux 5.15 Debian GNU/Linux 12 (bookworm) 12 (bookworm)
CPU: (2) x64 Intel(R) Xeon(R) CPU @ 2.30GHz
Memory: 5.93 GB / 7.28 GB
Container: Yes
Shell: 5.2.15 - /bin/bash
Binaries:
Node: 20.11.1 - /usr/local/bin/node
Yarn: 1.22.19 - /usr/local/bin/yarn
npm: 10.2.4 - /usr/local/bin/npm
npmPackages:
@opentelemetry/api: 1.7.0 => 1.7.0
@prisma/client: 5.7.1 => 5.7.1
esbuild: ^0.20.0 => 0.20.0
mdast-util-to-string: ^4.0.0 => 4.0.0
mdx-bundler: ^10.0.1 => 10.0.1
next: ^14.1.0 => 14.1.0
react: ^18.2.0 => 18.2.0
react-dom: ^18.2.0 => 18.2.0
sharp: 0.32.6 => 0.32.6
unist-util-visit: ^5.0.0 => 5.0.0
webpack: 5.89.0 => 5.89.0
List of package version
yarn envinfo --npmPackages
yarn run v1.22.21
$ /Users/tony/ts/webapp/node_modules/.bin/envinfo --npmPackages
npmPackages:
@babel/core: ^7.23.3 => 7.24.3
@babel/plugin-syntax-flow: ^7.23.3 => 7.24.1
@babel/plugin-transform-optional-chaining: ^7.23.4 => 7.24.1
@babel/plugin-transform-react-jsx: ^7.23.4 => 7.23.4
@clerk/clerk-sdk-node: ^4.13.11 => 4.13.11
@clerk/nextjs: ^4.29.9 => 4.29.9
@dagger.io/dagger: 0.9.10 => 0.9.10
@jest/globals: ^29.7.0 => 29.7.0
@mdx-js/loader: ^3.0.0 => 3.0.1
@mdx-js/react: ^3.0.0 => 3.0.1
@mdxeditor/editor: ^2.3.4 => 2.16.0
@next/bundle-analyzer: ^14.0.3 => 14.1.4
@next/mdx: ^14.1.0 => 14.1.4
@opentelemetry/api: 1.7.0 => 1.7.0
@opentelemetry/resources: 1.18.1 => 1.18.1
@opentelemetry/sdk-node: 0.45.1 => 0.45.1
@opentelemetry/sdk-trace-node: 1.18.1 => 1.18.1
@opentelemetry/semantic-conventions: 1.18.1 => 1.18.1
@playwright/test: ^1.40.0 => 1.42.1
@prisma/client: 5.7.1 => 5.7.1
@radix-ui/react-accordion: ^1.1.2 => 1.1.2
@radix-ui/react-checkbox: ^1.0.4 => 1.0.4
@radix-ui/react-dialog: ^1.0.5 => 1.0.5
@radix-ui/react-dropdown-menu: ^2.0.6 => 2.0.6
@radix-ui/react-form: ^0.0.3 => 0.0.3
@radix-ui/react-icons: ^1.3.0 => 1.3.0
@radix-ui/react-label: ^2.0.2 => 2.0.2
@radix-ui/react-popover: ^1.0.7 => 1.0.7
@radix-ui/react-radio-group: ^1.1.3 => 1.1.3
@radix-ui/react-scroll-area: ^1.0.5 => 1.0.5
@radix-ui/react-select: 2.0.0 => 2.0.0
@radix-ui/react-slider: ^1.1.2 => 1.1.2
@radix-ui/react-slot: ^1.0.2 => 1.0.2
@radix-ui/react-switch: ^1.0.3 => 1.0.3
@radix-ui/react-tabs: ^1.0.4 => 1.0.4
@radix-ui/react-toast: ^1.1.5 => 1.1.5
@radix-ui/react-toggle: ^1.0.3 => 1.0.3
@radix-ui/react-toggle-group: ^1.0.4 => 1.0.4
@radix-ui/react-tooltip: ^1.0.7 => 1.0.7
@semantic-release/changelog: ^6.0.3 => 6.0.3
@semantic-release/commit-analyzer: ^11.1.0 => 11.1.0
@semantic-release/git: ^10.0.1 => 10.0.1
@semantic-release/github: ^9.2.3 => 9.2.6
@semantic-release/npm: ^11.0.1 => 11.0.3
@semantic-release/release-notes-generator: ^12.1.0 => 12.1.0
@storybook/addon-essentials: ^7.5.3 => 7.6.17
@storybook/addon-interactions: ^7.5.3 => 7.6.17
@storybook/addon-links: ^7.5.3 => 7.6.17
@storybook/blocks: ^7.5.3 => 7.6.17
@storybook/nextjs: ^7.5.3 => 7.6.17
@storybook/react: ^7.5.3 => 7.6.17
@storybook/test-runner: ^0.15.2 => 0.15.2
@storybook/testing-library: ^0.2.2 => 0.2.2
@t3-oss/env-nextjs: ^0.7.1 => 0.7.3
@tailwindcss/typography: ^0.5.10 => 0.5.10
@testing-library/jest-dom: ^6.1.4 => 6.4.2
@testing-library/react: ^14.1.2 => 14.2.2
@total-typescript/ts-reset: ^0.5.1 => 0.5.1
@types/jest: ^29.5.10 => 29.5.12
@types/lodash: ^4.14.202 => 4.17.0
@types/mdx: ^2.0.10 => 2.0.12
@types/node: ^20.10.7 => 20.11.30
@types/react: ^18.2.38 => 18.2.69
@types/react-dom: ^18.2.17 => 18.2.22
@typescript-eslint/eslint-plugin: ^6.12.0 => 6.21.0
@typescript-eslint/parser: ^6.12.0 => 6.21.0
@vercel/otel: ^0.3.0 => 0.3.0
all-contributors-cli: ^6.26.1 => 6.26.1
autoprefixer: ^10.4.16 => 10.4.19
class-variance-authority: ^0.7.0 => 0.7.0
clsx: ^2.1.0 => 2.1.0
commander: ^11.1.0 => 11.1.0
cross-env: ^7.0.3 => 7.0.3
date-fns: ^3.3.1 => 3.6.0
esbuild: ^0.20.0 => 0.20.2
eslint: 8.54.0 => 8.54.0
eslint-config-next: 14.0.3 => 14.0.3
eslint-config-prettier: ^9.0.0 => 9.1.0
eslint-config-react-app: ^7.0.1 => 7.0.1
eslint-plugin-import: ^2.29.0 => 2.29.1
eslint-plugin-react: 7.33.2 => 7.33.2
eslint-plugin-storybook: ^0.6.15 => 0.6.15
eslint-plugin-tailwindcss: ^3.13.0 => 3.15.1
fetch-mock: ^9.11.0 => 9.11.0
github-slugger: ^2.0.0 => 2.0.0
gzip-size: 6 => 6.0.0
jest: ^29.7.0 => 29.7.0
jest-environment-jsdom: ^29.7.0 => 29.7.0
lodash: ^4.17.21 => 4.17.21
lucide-react: ^0.307.0 => 0.307.0
mdast-util-to-string: ^4.0.0 => 4.0.0
mdx: ^0.3.1 => 0.3.1
mdx-bundler: ^10.0.1 => 10.0.1
mkdirp: ^3.0.1 => 3.0.1
next: ^14.1.0 => 14.1.4
next-compose-plugins: ^2.2.1 => 2.2.1
next-themes: ^0.2.1 => 0.2.1
npm-only-allow: ^1.2.6 => 1.2.6
patch-package: ^8.0.0 => 8.0.0
postcss: ^8.4.31 => 8.4.38
postinstall-postinstall: ^2.1.0 => 2.1.0
prettier: 3.0.3 => 3.0.3
prettier-plugin-tailwindcss: ^0.5.7 => 0.5.12
prisma: ^5.7.1 => 5.11.0
react: ^18.2.0 => 18.2.0
react-dom: ^18.2.0 => 18.2.0
semantic-release: ^22.0.8 => 22.0.12
sharp: 0.32.6 => 0.32.6
sonner: ^1.3.1 => 1.4.41
storybook: ^7.5.3 => 7.6.17
stripe: ^14.12.0 => 14.22.0
svix: ^1.15.0 => 1.21.0
tailwind-merge: ^2.0.0 => 2.2.2
tailwindcss: ^3.3.5 => 3.4.1
tailwindcss-animate: ^1.0.7 => 1.0.7
tailwindcss-typography: ^3.1.0 => 3.1.0
ts-jest: ^29.1.1 => 29.1.2
tsx: ^4.7.1 => 4.7.1
typescript: ^5.3.3 => 5.4.3
unist-util-visit: ^5.0.0 => 5.0.0
webpack: 5.89.0 => 5.89.0
zod: ^3.22.4 => 3.22.4
zustand: ^4.5.0 => 4.5.2
Hello @verdverm!
I haven't managed to replicate the issue, I've tried it and the environment variables seems to load as expected, can you provide a minimal reproduction so I can have a better look at it?
Also it's not so clear if that's a Clerk of Next.js issue, as we are depending on Next.js to load the variables, we don't do any parsing of the environment variables.
Thank you @verdverm , I was getting the same error and was losing my mind. Changing the env variables in Vercel fixed it for me
Happy to hear that you've resolved this!
I will be closing this to keep our issues tidied, but feel free to re-open it.