next-auth: Google Provider TODO: Handle OIDC response body error

Provider type

Google

Environment

 System:
    OS: macOS 14.4.1
    CPU: (11) arm64 Apple M3 Pro
    Memory: 127.47 MB / 18.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 21.7.3 - ~/.nvm/versions/node/v21.7.3/bin/node
    npm: 10.5.0 - ~/.nvm/versions/node/v21.7.3/bin/npm
  Browsers:
    Safari: 17.4.1
  npmPackages:
    @auth/mongodb-adapter: ^2.6.0 => 2.6.0 
    next: ^14.2.1 => 14.2.1 
    next-auth: ^5.0.0-beta.16 => 5.0.0-beta.16 
    react: ^18.2.0 => 18.2.0

Reproduction URL

https://github.com/TodayWantLook/TWL-NextJS/tree/developer/iniru

Describe the issue

I seem to be having some issues getting the callbackurl from Google. I have attached the error in the picture above.

How to reproduce

//env.local

DB_NAME = DB_NAME
DB_URL = DB_URL

NEXTAUTH_URL = https://todaywantlook.vercel.app
AUTH_SECRET = secret

AUTH_GOOGLE_ID = ''
AUTH_GOOGLE_SECRET = ''

After making the above settings, you should see a prompt to check the Server Error Log when you arrive at the login page.

Expected behavior

The callbackurl should be routed correctly and you should be able to receive the login user information to the callbackurl normally.

About this issue

Original URL
State: open
Created 2 months ago
Reactions: 1
Comments: 26 (8 by maintainers)

Most upvoted comments

@murilobd the correct environment variable is AUTH_URL, give that a shot. The AUTH_REDIRECT_PROXY_URL may have avoided the initial error, but it enables a whoel different flow inside the core, it’s not what you want. Please remove it and try AUTH_URL instead of APP_URL 🙏

EDIT: Also small sidenote, to get that log output it seems like yuo want, you can use console.table or add \n to the end of each line so the console.log prints a new line

ndom91 on Apr 28, 2024

Yeah so that’s the default thing your node process running next.js will expose. So your node process is running on a VM or container or whatever in Amplify and its exposing the applicaiotn at localhost:3000. Then Amplify will put a reverse proxy in front of that node process which will terminate and negotiate the SSL/TLS connection and accept traffic at https://app-123.aws.amplify.com (or whatever) and pass that traffic onto the node process in the container at localhost:3000. So yeah that part is fine 👍

But also, the fact that that reverse proxy is in the way, is why your application doesn’t know anything about the final URL and you need to tell it via AUTH_URL. But also, that reminds me (!), you’ll also need to enable the trustHost configuration option to tell next.js / auth.js to trust the URL that that reverse proxy tells the node process (via the X-Forwarded-Host header it appends to requests when handing the request off to the node process) (Docs)

So long story short, try also adding trustHost: true to your auth.js config, or adding the AUTH_TRUST_HOST=true env var to your environment

Sidenote: In real life there’s multiple reverse proxies / load balancers / CDN’s in between you and the node process running your node.js app in an AWS container in amplify or whatever.

ndom91 on Apr 28, 2024

From that it seems like your clientId is either incorrect (copy and paste error maybe?) or just not being picked up. In order to infer it automatically, and not have to manually pass it to the Google() provider in your configuration, the environment variables have to be named like this:
AUTH_GOOGLE_ID
AUTH_GOOGLE_SECRET
Do you have that in place in your environment?

@ndom91 Yes, It’s already set up and passes well to Google OAuth. The error seems to be in the CallbackRouting part.

INIRU on Apr 28, 2024