Next.js Discord

Discord Forum

NextAuth.js error

Answered
SharpieMaster posted this in #help-forum
Open in Discord
Original message was deleted.
Answered by SharpieMaster
new
View full answer

24 Replies

Avatar
SharpieMaster
I am getting 2 different errors
[next-auth][error][OAUTH_CALLBACK_HANDLER_ERROR] 
https://next-auth.js.org/errors#oauth_callback_handler_error getUserByAccount is not a function {
  message: 'getUserByAccount is not a function',
  stack: 'TypeError: getUserByAccount is not a function\n' +
    '    at Object.callback (webpack-internal:///(rsc)/./node_modules/.pnpm/next-auth@4.23.1_next@13.4.19_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/core/routes/callback.js:42:49)\n' +       
    '    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)\n' +
    '    at async AuthHandler (webpack-internal:///(rsc)/./node_modules/.pnpm/next-auth@4.23.1_next@13.4.19_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/core/index.js:202:38)\n' +
    '    at async NextAuthRouteHandler (webpack-internal:///(rsc)/./node_modules/.pnpm/next-auth@4.23.1_next@13.4.19_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/next/index.js:50:30)\n' +      
    '    at async NextAuth._args$ (webpack-internal:///(rsc)/./node_modules/.pnpm/next-auth@4.23.1_next@13.4.19_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/next/index.js:84:24)\n' +
    '    at async eval (webpack-internal:///(rsc)/./node_modules/.pnpm/next@13.4.19_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/server/future/route-modules/app-route/module.js:254:37)',       
  name: 'TypeError'
}
when I try to sign in
and
[next-auth][error][JWT_SESSION_ERROR] 
https://next-auth.js.org/errors#jwt_session_error Invalid Compact JWE {
  message: 'Invalid Compact JWE',
  stack: 'JWEInvalid: Invalid Compact JWE\n' +
    '    at compactDecrypt (webpack-internal:///(rsc)/./node_modules/.pnpm/jose@4.14.6/node_modules/jose/dist/node/cjs/jwe/compact/decrypt.js:18:15)\n' +
    '    at jwtDecrypt (webpack-internal:///(rsc)/./node_modules/.pnpm/jose@4.14.6/node_modules/jose/dist/node/cjs/jwt/decrypt.js:10:61)\n' +
    '    at Object.decode (webpack-internal:///(rsc)/./node_modules/.pnpm/next-auth@4.23.1_next@13.4.19_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/jwt/index.js:44:52)\n' +
    '    at async Object.session (webpack-internal:///(rsc)/./node_modules/.pnpm/next-auth@4.23.1_next@13.4.19_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/core/routes/session.js:25:34)\n' +   
    '    at async AuthHandler (webpack-internal:///(rsc)/./node_modules/.pnpm/next-auth@4.23.1_next@13.4.19_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/core/index.js:161:37)\n' +
    '    at async getServerSession (webpack-internal:///(rsc)/./node_modules/.pnpm/next-auth@4.23.1_next@13.4.19_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/next/index.js:125:21)\n' +
    '    at async RootLayout (webpack-internal:///(rsc)/./src/app/layout.tsx:24:21)',
  name: 'JWEInvalid'
}

Whenever I load a page
Image
If you need any information please ask
Avatar
SharpieMaster
Please
Avatar
Satin Angora
can you please give me some details or code snippet where you have define or use your "getUserByAccount" function.
Avatar
Sun bear
You need to provide a much more detailed explanation for your code man
Avatar
SharpieMaster
I do not ever define or use getUserByAccount, I am using Next Auth js with the prisma adapter
schema.prisma is just the standard nextauth things like user account session and a token or something
I am using github provider and I do have all the env variables needed
I do not currently have all of my files since I forgot to commit them on my pc, but I will able to provide the specific files in 10h
Avatar
SharpieMaster
Yes, thats why I said to ask because I dont know which files are useful
schema.prisma:

// This is your Prisma schema file,
// learn more about it in the docs: https://pris.ly/d/prisma-schema

generator client {
    provider = "prisma-client-js"
}

datasource db {
    provider = "sqlite"
    url      = env("DATABASE_URL")
}

model Account {
    id                 String    @id @default(cuid())
    userId             String
    providerType       String
    providerId         String
    providerAccountId  String
    refreshToken       String?
    accessToken        String?
    accessTokenExpires DateTime?
    createdAt          DateTime  @default(now())
    updatedAt          DateTime  @updatedAt
    user               User      @relation(fields: [userId], references: [id])

    @@unique([providerId, providerAccountId])
}

model Session {
    id           String   @id @default(cuid())
    userId       String
    expires      DateTime
    sessionToken String   @unique
    accessToken  String   @unique
    createdAt    DateTime @default(now())
    updatedAt    DateTime @updatedAt
    user         User     @relation(fields: [userId], references: [id])
}

model User {
    id            String    @id @default(cuid())
    name          String?
    email         String?   @unique
    emailVerified DateTime?
    image         String?
    createdAt     DateTime  @default(now())
    updatedAt     DateTime  @updatedAt
    accounts      Account[]
    sessions      Session[]
}

model VerificationRequest {
    id         String   @id @default(cuid())
    identifier String
    token      String   @unique
    expires    DateTime
    createdAt  DateTime @default(now())
    updatedAt  DateTime @updatedAt

    @@unique([identifier, token])
}
src/app/api/auth/[...nextauth]/route.ts:

import NextAuth from "next-auth";
import GithubProvider from "next-auth/providers/github";
import { PrismaAdapter } from "@next-auth/prisma-adapter";
import { prisma } from "@/server/db/client";

const adapter = NextAuth({
    adapter: PrismaAdapter(prisma),
    providers: [
        GithubProvider({
            clientId: process.env.GITHUB_ID ?? "",
            clientSecret: process.env.GITHUB_SECRET ?? "",
        }),
    ],
});

export { adapter as GET, adapter as POST };
src/server/db/client.ts:

import { PrismaClient } from "@prisma/client";

declare global {
    var prisma: PrismaClient | undefined;
}

export const prisma = global.prisma || new PrismaClient();

if (process.env.NODE_ENV !== "production") global.prisma = prisma;
layout.tsx:

import "./globals.css";
import type { Metadata } from "next";
import { Inter } from "next/font/google";
import SessionProvider from "./components/SessionProvider";
import { getServerSession } from "next-auth";

const inter = Inter({ subsets: ["latin"] });

export const metadata: Metadata = {
    title: "Create Next App",
    description: "Generated by create next app",
};

export default async function RootLayout({
    children,
}: {
    children: React.ReactNode;
}) {
    const session = await getServerSession();

    return (
        <html lang="en">
            <head>
                <link
                    rel="/vercel.svg"
                    href="favicon.ico"
                    type="image/x-icon"
                />
            </head>
            <body className={`${inter.className} min-h-screen`}>
                <SessionProvider session={session}>{children}</SessionProvider>
            </body>
        </html>
    );
}
SessionProvider.ts:

"use client";
import { SessionProvider } from "next-auth/react";
export default SessionProvider;
Image
    "dependencies": {
        "@next-auth/prisma-adapter": "^1.0.7",
        "@prisma/client": "5.3.1",
        "@types/node": "20.6.2",
        "@types/react": "18.2.21",
        "@types/react-dom": "18.2.7",
        "autoprefixer": "10.4.15",
        "eslint": "8.49.0",
        "eslint-config-next": "13.4.19",
        "next": "13.5.2",
        "postcss": "8.4.29",
        "prettier": "^3.0.3",
        "react": "18.2.0",
        "react-dom": "18.2.0",
        "tailwindcss": "3.3.3",
        "typescript": "5.2.2",
        "next-auth": "^4.23.1"
    },
    "devDependencies": {
        "prisma": "^5.3.1"
    }
Avatar
SharpieMaster
I fixed the next auth error, but I still get the json web token error 
[next-auth][error][JWT_SESSION_ERROR] 
https://next-auth.js.org/errors#jwt_session_error Invalid Compact JWE {
  message: 'Invalid Compact JWE',
  stack: 'JWEInvalid: Invalid Compact JWE\n' +
    '    at compactDecrypt (webpack-internal:///(rsc)/./node_modules/.pnpm/jose@4.14.6/node_modules/jose/dist/node/cjs/jwe/compact/decrypt.js:18:15)\n' +
    '    at jwtDecrypt (webpack-internal:///(rsc)/./node_modules/.pnpm/jose@4.14.6/node_modules/jose/dist/node/cjs/jwt/decrypt.js:10:61)\n' +
    '    at Object.decode (webpack-internal:///(rsc)/./node_modules/.pnpm/next-auth@4.23.1_next@13.5.2_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/jwt/index.js:44:52)\n' +
    '    at async Object.session (webpack-internal:///(rsc)/./node_modules/.pnpm/next-auth@4.23.1_next@13.5.2_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/core/routes/session.js:25:34)\n' +
    '    at async AuthHandler (webpack-internal:///(rsc)/./node_modules/.pnpm/next-auth@4.23.1_next@13.5.2_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/core/index.js:161:37)\n' +
    '    at async getServerSession (webpack-internal:///(rsc)/./node_modules/.pnpm/next-auth@4.23.1_next@13.5.2_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/next/index.js:125:21)\n' +
    '    at async RootLayout (webpack-internal:///(rsc)/./src/app/layout.tsx:24:21)',
  name: 'JWEInvalid'
Avatar
SharpieMaster
new
Answer