You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Configure google cloud api and use google provider
build the project use it
Describe the bug
Hello everyone.
I have a problem with my google provider when using it in production.
When I want to authenticate with Google in production (so with the url https://my-prod.com) it sends me an error 400: redirect_uri_mismatch with its information: redirect_uri=http://localhost:3000/api/auth/callback/google.
After searching, I saw this issue #664 and so I modified my [...].ts to have this
But I now have another problem: when I arrive at my callback url, I'm automatically redirected to http://localhost:3000/api/auth/error?error=OAuthCallback.
with an error in my app:
[next-auth][error][OAUTH_CALLBACK_ERROR]
https://next-auth.js.org/errors#oauth_callback_error redirect_uri_mismatch (Bad Request) {
error: OPError: redirect_uri_mismatch (Bad Request)
at processResponse (/app/.output/server/node_modules/openid-client/lib/helpers/process_response.js:38:13)
at Client.grant (/app/.output/server/node_modules/openid-client/lib/client.js:1354:22)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async Client.callback (/app/.output/server/node_modules/openid-client/lib/client.js:493:24)
at async oAuthCallback (/app/.output/server/node_modules/next-auth/core/lib/oauth/callback.js:109:16)
at async Object.callback (/app/.output/server/node_modules/next-auth/core/routes/callback.js:52:11)
at async AuthHandler (/app/.output/server/node_modules/next-auth/core/index.js:208:28)
at async Object.handler (file:///app/.output/server/chunks/routes/api/auth/_..._.mjs:85:24)
at async Object.handler (file:///app/.output/server/chunks/runtime.mjs:3075:19)
at async Server.toNodeHandle (file:///app/.output/server/chunks/runtime.mjs:3341:7) {
name: 'OAuthCallbackError',
code: undefined
},
providerId: 'google',
message: 'redirect_uri_mismatch (Bad Request)'
}
After searching and seeing different issues, I think it's because it couldn't get my AUTH_ORIGIN environment variable (or maybe NEXTAUTH_URL (I tried to put both to hope for a different result but nothing)).
Checking the nuxt doc I came across this
Production Preview After your server is built, you are responsible for setting environment variables when you run the server. Your .env file will not be read at this point. How you do this is different for every environment.
I'm afraid this is what makes all the difference with my dev environment and therefore causes all the errors.
Does anyone have a solution? I'm deeply blocked and can't see what the solution is.
I assume that this issue occurs because you have set a different redirect URL in the Google OAuth application.
Please open your Google cloud console and verify the OAuth application redirect URL matches your production URL. Below I posted an example from one of my applications using NuxtAuth (and FushionAuth).
When it comes to the environment variables, I recommend the following:
Set AUTH_ORIGIN to: https://MY_DOMAIN.com
Set NEXTAUTH_URL to: https://MY_DOMAIN.com/api/auth
Do not set auth.baseURL in the nuxt.config.ts, as this overwrites the AUTH_ORIGIN environment variable!
auth.baseURL sets the URL at build time, while AUTH_ORIGIN lets you configure it at runtime!
Environment
Working directory: /app
Nuxt project info:
Reproduction
Describe the bug
Hello everyone.
I have a problem with my google provider when using it in production.
When I want to authenticate with Google in production (so with the url
https://my-prod.com
) it sends me an error 400: redirect_uri_mismatch with its information:redirect_uri=http://localhost:3000/api/auth/callback/google
.After searching, I saw this issue #664 and so I modified my [...].ts to have this
And now I can select my email in google!
But I now have another problem: when I arrive at my callback url, I'm automatically redirected to
http://localhost:3000/api/auth/error?error=OAuthCallback
.with an error in my app:
After searching and seeing different issues, I think it's because it couldn't get my AUTH_ORIGIN environment variable (or maybe NEXTAUTH_URL (I tried to put both to hope for a different result but nothing)).
Checking the nuxt doc I came across this
Production Preview
After your server is built, you are responsible for setting environment variables when you run the server. Your .env file will not be read at this point. How you do this is different for every environment.
I'm afraid this is what makes all the difference with my dev environment and therefore causes all the errors.
Does anyone have a solution? I'm deeply blocked and can't see what the solution is.
Additional context
My auth part in nuxt.config.ts :
Logs
No response
The text was updated successfully, but these errors were encountered: