Theo's Typesafe Cult•16mo ago

NextAuth auth flow causes Next.js 13 dev server to crash without throwing any errors

I'm building a note-taking app with ct3a (partly inspired by Jack Herrington's awesome T3 video) but I'm having a really weird issue with NextAuth where the auth flow succeeds, OAuth2 callback route is hit, but then for some reason the Next.js dev server crashes without throwing any errors whatsoever. I'm positive the auth flow is working properly because running NextAuth in debug mode shows a successful OAuth2 callback response with data - but it's still not throwing errors. Here's a slightly censored version of the console output from NextAuth:

[next-auth][debug][OAUTH_CALLBACK_RESPONSE] {
  profile: {
    id: '524646212624711721',
    name: 'lucca.dr',
    email: ***REDACTED***,
    image: 'https://cdn.discordapp.com/avatars/524646212624711721/a_6b40cd1aa88086a7fdbf07b5b6c8e2e0.gif'
  },
  account: {
    provider: 'discord',
    type: 'oauth',
    providerAccountId: ***REDACTED***,
    access_token: ***REDACTED***,
    expires_at: 1677628006,
    refresh_token: ***REDACTED***,
    scope: 'identify email',
    token_type: 'Bearer'
  },
  OAuthProfile: {
    id: '524646212624711721',
    username: 'lucca.dr',
    display_name: null,
    avatar: 'a_6b40cd1aa88086a7fdbf07b5b6c8e2e0',
    avatar_decoration: null,
    discriminator: '0001',
    public_flags: 4194304,
    flags: 4194304,
    banner: 'a_20986b885071b694e6e9a401e3308c5c',
    banner_color: '#2e3d72',
    accent_color: 3030386,
    locale: 'en-US',
    mfa_enabled: true,
    premium_type: 2,
    email: ***REDACTED***,
    verified: true,
    image_url: 'https://cdn.discordapp.com/avatars/524646212624711721/a_6b40cd1aa88086a7fdbf07b5b6c8e2e0.gif'
  }
}

[next-auth][debug][OAUTH_CALLBACK_RESPONSE] {
  profile: {
    id: '524646212624711721',
    name: 'lucca.dr',
    email: ***REDACTED***,
    image: 'https://cdn.discordapp.com/avatars/524646212624711721/a_6b40cd1aa88086a7fdbf07b5b6c8e2e0.gif'
  },
  account: {
    provider: 'discord',
    type: 'oauth',
    providerAccountId: ***REDACTED***,
    access_token: ***REDACTED***,
    expires_at: 1677628006,
    refresh_token: ***REDACTED***,
    scope: 'identify email',
    token_type: 'Bearer'
  },
  OAuthProfile: {
    id: '524646212624711721',
    username: 'lucca.dr',
    display_name: null,
    avatar: 'a_6b40cd1aa88086a7fdbf07b5b6c8e2e0',
    avatar_decoration: null,
    discriminator: '0001',
    public_flags: 4194304,
    flags: 4194304,
    banner: 'a_20986b885071b694e6e9a401e3308c5c',
    banner_color: '#2e3d72',
    accent_color: 3030386,
    locale: 'en-US',
    mfa_enabled: true,
    premium_type: 2,
    email: ***REDACTED***,
    verified: true,
    image_url: 'https://cdn.discordapp.com/avatars/524646212624711721/a_6b40cd1aa88086a7fdbf07b5b6c8e2e0.gif'
  }
}

Currently my NextAuth config has Google and Discord as OAuth providers, but they both end up crashing the Next.js dev server inexplicably. Here is the repo - relevant code can be found in the editor branch. No detailed README yet but it's just a standard ct3a Next.js project: Prisma, Tailwind, NextAuth, TRPC https://github.com/ChromeUniverse/luccanotes/tree/editor

GitHub

GitHub - ChromeUniverse/luccanotes at editor

A full-stack note-taking app for Markdown lovers ❤️ - GitHub - ChromeUniverse/luccanotes at editor

101 Replies

barry•16mo ago

share github repo

lucca•16mo ago

yep just pushing some changes to a new branch

barry•16mo ago

ima spin up postgres and run it see what happens

lucca•16mo ago

okie dokie, much appreciated - I've added some more info in the main post Oh, interestingly enough, Vercel shows some errors on build Ah never mind, it's just complaining that I forgot to set the env vars on Vercel but I don't think that's useful

lucca•16mo ago

lucca•16mo ago

I've added a dummy login button that invokes NextAuth's signIn() method

barry•16mo ago

for me its saying its missing type defs for @codemirror\state

lucca•16mo ago

Huh

barry•16mo ago

fixed it idk what happened lol

lucca•16mo ago

Wait that doesn't make sense

lucca•16mo ago

https://www.npmjs.com/package/@codemirror/state

npm

@codemirror/state

Editor state data structures for the CodeMirror code editor. Latest version: 6.2.0, last published: 2 months ago. Start using @codemirror/state in your project by running npm i @codemirror/state. There are 263 other projects in the npm registry using @codemirror/state.

lucca•16mo ago

look, @codemirror/state has built-in TS defs

barry•16mo ago

i did pnpm i @codemirror/state and it worked, idk why it didnt install when i did pnpm i

lucca•16mo ago

well shoot

barry•16mo ago

so, i can login just fine but i did 1 change, i removed google cuz never set that shit up for oauth but ill try with it

lucca•16mo ago

I just checked and @codemirror/state really wasn't in the package.json lol My bad

barry•16mo ago

oh lol makes more sense now 🤣

lucca•16mo ago

Oh shoot so you got it the login to work on your end?

barry•16mo ago

lucca•16mo ago

So I'm assuming you just removed the GoogleProvider() setup in /src/server/auth.ts?

barry•16mo ago

lucca•16mo ago

Tried doing the same but the Discord login option still isn't working either What really boggles my mind is that the Next.js dev server just crashes without throwing any errors

barry•16mo ago

everything is working for me melkeyStare

lucca•16mo ago

bruh what am I missing here lol

barry•16mo ago

added google too works fine

lucca•16mo ago

hates me what the actual heck

barry•16mo ago

how did you setup your callbacks

barry•16mo ago

barry•16mo ago

lucca•16mo ago

Yeah that's exactly how I set up mine too

lucca•16mo ago

lucca•16mo ago

barry•16mo ago

removing google didnt work for you?

lucca•16mo ago

Don't think I'm missing anything here Nope

barry•16mo ago

hmm wdym by it crashes it just goes down?

lucca•16mo ago

Yeah the dev server just exits and doesn't throw any errors to the console

barry•16mo ago

what about the browser

lucca•16mo ago

This is all I'm getting

barry•16mo ago

like the console before it goes blank in browser

lucca•16mo ago

Oh Lemme check

lucca•16mo ago

Nope, nothing - this is all I get when trying to login with Discord:

barry•16mo ago

https://tenor.com/view/wow-thats-weird-elf-odd-strange-gif-19521039

Tenor

barry•16mo ago

node version?

lucca•16mo ago

Preserve log is turned on, that message with the https://discord.com/jobs is the last thing that appears before getting redirected to the callback URL v19.2.0

barry•16mo ago

ohh might be it

barry•16mo ago

https://nodejs.org/en/

Node.js

Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.

barry•16mo ago

get LTS next auth has been a pain with versions from time to time

lucca•16mo ago

Oh Should I downgrade to the latest LTS then?

barry•16mo ago

lucca•16mo ago

okay lemme try that then Alright I installed 18.14.2 with nvm let's see how this goes Shit, no luck 😞 Same thing still

lucca•16mo ago

barry•16mo ago

https://tenor.com/view/upset-crying-pain-cute-too-much-pain-gif-15829570

Tenor

barry•16mo ago

what about the good old restart pc

lucca•16mo ago

lmao i'll take what I can get at this point I think I'll try reinstalling my dependencies first nope nothing I'll try restarting my computer, brb

barry•16mo ago

i can build just fine same versions of node npm everything, login works idk whats happening lol

lucca•16mo ago

Restarted my laptop, still no dice. This is such a weird error. I don't have any other machines on hand, so I'm just gonna try doing a preview deployment to Vercel, changing my callback URLs and hope for the best https://luccanotes-git-editor-chromeuniverse.vercel.app/ Right so I managed to not get any errors or weird behaviors on this preview deployment on it means it's working...? I haven't added any visible way to make sure you're logged in... 😛 🤦‍♂️ Okay so I finally got something

lucca•16mo ago

lucca•16mo ago

I built the next app locally and ran it the built app with npm run start When I try doing the login flow I get a segfault of some sort The Next dev server exists with status 139

lucca•16mo ago

Okay so I did a full freakin reinstall of Node.js, npm and nvm as per this very thorough Stack Overflow answer: https://stackoverflow.com/questions/32426601/how-can-i-completely-uninstall-nodejs-npm-and-node-in-ubuntu/60701804#60701804

Stack Overflow

How can I completely uninstall nodejs, npm and node in Ubuntu

The Question is similar to How do I completely uninstall Node.js, and reinstall from beginning (Mac OS X) but for Ubuntu, and just for uninstalling. Installation was done by: sudo apt-get install n...

lucca•16mo ago

BUT IT'S STILL NOT WORKING AFKJASADKJFHASKDF lmao

lucca•16mo ago

lucca•16mo ago

Went back to basics and created a new t3 starter app just to find out whether it's a problem with my machine or with my current project And it looks like NextAuth and tRPC are working fine on the basic t3 app so that should isolate the problem to my current project, right...? <a:pooh_think:1051378453724794941> I wonder if it's a problem with Prisma The start app is using SQLite but I'm using Postgres with Supabase

barry•16mo ago

You did prisma db push right

lucca•16mo ago

@barry Spun up a new Postgres DB locally and it's perfectly working fine... I guess it's a problem with Supabase then, it's my first time trying it out Yup several times on several different DBs (SQLite, Postgres, Postgres @ Supabase) wtf it's actually working with supabase now

lucca•16mo ago

https://tenor.com/view/chris-rock-huh-what-confused-wtf-gif-18025317

Tenor

lucca•16mo ago

lucca•16mo ago

bruh it stopped working wtf I updated my schema and pushed it to Supabase with npx prisma db push and it's not working anymore??? why what how huh

nexxel•16mo ago

yep this is a thing happens to me a lot

lucca•16mo ago

oh fr? damn Is this issue specific to supabase or a broken prisma release or something?

nexxel•16mo ago

for me to make it work i have to click on the address bar and click enter to reload and then it works https://nexxel-has.no-friends.xyz/brave_POU2Mt9fuh.mp4

nexxel•16mo ago

not an issue with prisma afaik

lucca•16mo ago

Well this doesn't address the fact that my dev server keeps crashing for no reason unfortunately

nexxel•16mo ago

i don't remember having dev server crashes but give it a try maybe it works lol

lucca•16mo ago

Yeah no dice For some reason it seems that Prisma can't connect my Supabase DB and it's causing some weird behavior with NextAuth where it can't query the sessions/accounts/whatever from the DB I'm not quetting any prisma:query logs in my console most of the time But when I use a local Postgres DB it works fine

nexxel•16mo ago

maybe supabase is down?

lucca•16mo ago

Nope https://status.supabase.com/

Supabase Status

Welcome to Supabase's home for real-time and historical data on system performance.

nexxel•16mo ago

yeah just saw

lucca•16mo ago

Yeah no recent outages

lucca•16mo ago

lucca•16mo ago

lucca•16mo ago

Yeah so clearly it lookss like it's some sort of issue with either Prisma or Supabase I try to run Prisma studio on my Supabase DB and it just segfaults and dies

nexxel•16mo ago

what node version are you on

lucca•16mo ago

Latest LTS

nexxel•16mo ago

try downgrading to 16

lucca•16mo ago

Did a full fresh reinstall yesterday I mean I guess I could try downgrading but to the best of my knowledge this is an issue with Supabase, I think I should maybe open a new issue in their repo...? What the latest v16.x LTS release?

nexxel•16mo ago

just with your node version manager do 16

lucca•16mo ago

I think imma try Railway and see I have any issues with their Postgres DBs

nexxel•16mo ago

and it'll select the lts 16.x i had the segmentation error with prisma in a nuxt app it worked when i downgraded to 16

lucca•16mo ago

Huh Alright so I installed v16.19.1 imma give it a go It actually fucking worked lmao but why though?

nexxel•16mo ago

lol i think its some prisma issue i didn't bother opening an issue but you should

lucca•16mo ago

Yeah I'll try to get on that later today tysm! @nexxel

nexxel•16mo ago

lucca•16mo ago

Also am I missing out on any important features by using node 16?

nexxel•16mo ago

no not really there's some new stuff like node -w but i don't think you'll be using that in a next.js app

lucca•16mo ago

What does that do? Never used that -w flag before

nexxel•16mo ago

it runs a file in watch mode so like when you save it reloads only works on .js files i think it might be -watch

lucca•16mo ago

Interesting, switching back and forth between latest LTS releases of v16 and v18 shows that v16 consistently works while v18 consisntently doesn't lmao Oh, I already got nodemon for that lol Or the next.js dev server or whatever

nexxel•16mo ago

another new thing is the alternative syntax to import native node packages like fs and crypto, etc it used to fs or crypto which still works but you can also now do node:fs or node:crypto there might be more things im missing out

lucca•16mo ago

Oh I think I've seen that in the wild before but never bothered to look up what it actually meant

barry•16mo ago

I was on LTS today/last night when testing your code worked fine This is just 🥲 wtf

lucca•16mo ago

certified node.js moment deranged

for taking the time to help me out too 🙂

Gaming

Programming

NextAuth auth flow causes Next.js 13 dev server to crash without throwing any errors