Next JS - Auth Section - Retrieve token api function - token is always null

Implemented code to display next-auth token. When coded exactly like Mosh’s video, it produces an error regarding the return being an object {}. While debugging, I see that getToken always returns null. (screenshot line 9).

I can see the auth cookies in my application tab.

Also, when using the NextResponse.json() method on the return, it always produces this error.

oopsie Objects are not valid as a React child (found: object with keys {}). If you meant to render a collection of children, use an array instead.

I can correct that by using JSON Stringify first. But I think the issue is caused by the empty token object. Regardless, the primary issue is that getToken() always returns null and I can’t figure out why.

While this demo function is only for fun - I just feel like auth is not working throughout the app and this is just a symptom. Anyone have any ideas?

Jerry
TypeScript React Next.js #next @mosh

SOLVED!

After 100,000 hours of testing and trial/error, I discovered that I named my file page.tsx. It needed to be route.tsx. Once I renamed it all worked perfectly.

I will leave this embarrassment here in case it helps someone else.

As an aside — as a 35 year veteran programmer … things go wrong for all of us.

1 Like