Next.js Discord

Discord Forum

TypeError: Cannot read properties of undefined (reading 'AUTH_SECRET')

Unanswered
Maine Coon posted this in #help-forum
Open in Discord
Avatar
Maine CoonOP
I'm running into some trouble with my nextjs app. I'm using auth.js and hono.js. For some reason, it is unable to find the auth_secret even though it is in my env.local

In the following code, c:Context the .env field is undefined. How would I fix that?
import { Context, Hono } from "hono";
import { handle } from "hono/vercel";

import authConfig from "@/auth.config";

import { AuthConfig, initAuthConfig } from "@hono/auth-js";

import board from "./board";
import boardId from "./page/board-id";
import card from "./card";
import home from "./page/home";
import list from "./list";
import orgs from "./orgs";
import plan from "./page/plan";
import taskPage from "./page/task";
import userOrgs from "./user-orgs";
import users from "./users";

const getAuthConfig = (c: Context): AuthConfig => ({
  ...authConfig,
  secret: c.env.AUTH_SECRET as string,
});

const app = new Hono().basePath("/api");

app.use("*", initAuthConfig(getAuthConfig));

const routes = app
  .route("/board", board)
  .route("/board-id", boardId)
  .route("/card", card)
  .route("/home", home)
  .route("/list", list)
  .route("/orgs", orgs)
  .route("/plan", plan)
  .route("/task", taskPage)
  .route("/user-orgs", userOrgs)
  .route("/users", users);

export const DELETE = handle(app);
export const GET = handle(app);
export const PATCH = handle(app);
export const POST = handle(app);

export type AppType = typeof routes; 

Appreciate any help I can get!

14 Replies

Avatar
are you using nextAuth?
because you don't have to set secret in configs object as long as you put it in the .env.local file?
Avatar
Maine CoonOP
Yes I am using nextAuth. This is from the hono documentation on github https://github.com/honojs/middleware/tree/main/packages/auth-js
Avatar
Then try NEXTAUTH_SECRET instead of AUTH_SECRET in .env file.
Avatar
Maine CoonOP
No I guess its not nextauth bc that's Auth.js now? https://authjs.dev/getting-started/installation
const getAuthConfig = (c: Context): AuthConfig => {
  console.log(c);
  return {
    ...authConfig,
    secret: c.env.AUTH_SECRET,
  };
};

When I do this, it logs:
Context {
env: undefined,
finalized: false,
error: undefined,
render: [Function: render],
setLayout: [Function: setLayout],
getLayout: [Function: getLayout],
setRenderer: [Function: setRenderer],
header: [Function: header],
status: [Function: status],
set: [Function: set],
get: [Function: get],
newResponse: [Function: newResponse],
body: [Function: body],
text: [Function: text],
json: [Function: json],
html: [Function: html],
redirect: [Function: redirect],
notFound: [Function: notFound]
}

And as you can see the env field is undefined, which hasn't happened to me before. I tried reverting back to react 18 but that didn't help.
I also tried using process.env.AUTH_SECRET but that produced a different error about how my routes didn't have Responses. But I never used process.env for this ever and the syntax in the hono document has worked in the past
Avatar
have you tried NEXTAUTH_SECRET variable?
what is the name of the env file?
out of curiousity
plus, context object is giving you that env is undefined, so normally you can't access the secret like that.
Avatar
Maine CoonOP
No it doesn’t work
.env.local
Avatar
Did you remove secret prop from config object? Try that
Avatar
Maine CoonOP
No that didn't work, I stripped out Hono from the project and am just using drizzle and neon db raw without it. Shame that must be a weird bug somewhere in Honojs