Google Auth Redirection Not Working (Netlify & AWS)
Hi everyone, I am currently trying to deploy an app built with Open-Saas on Netlify and AWS EC2 instance with Nginx. Everything was working in the developer environment, but when I try logging in via Google it breaks. The Google Auth screen shows up normally and gives a response that results in several redirects, but after signing in it eventually redirects to https://myapp.netlify.app/oauth/callback, where it is met with a 404 (the same redirection returns a 304 in local developing environment). I have posted the screenshots from Google Dev console. At the time of failure, the url showing up in chrome is https://myapp.netlify.app/oauth/callback#{long_token}
I went though the docs and previous questions but was not able to find much helpful information. I imagine it has something to do with the
netlify.toml file but am not sure what to change. Please let me know if there are any other information I can provide. Any suggestion would be much appreciated!
14 Replies
Hi @DavidFeng. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
Hmm, I don't know enough to give you a confident answer yet. However, based on the knowledge sources provided, it seems like you might need to check your Google OAuth app settings and ensure that the correct redirect URIs are set.
In the Google Cloud Platform console, under the OAuth consent screen, you should have your redirect URIs set to
<http://localhost:3001/auth/google/callback> for local development and <https://your-server-url.com/auth/google/callback> for your deployed server. Replace your-server-url.com with the actual URL of your deployed server.
Also, ensure that your Google client ID and secret are correctly set in your .env.server file.
Here are the relevant documentation links for setting up Google Auth in Wasp:
- Creating a Google OAuth App (https://wasp-lang.dev/docs/auth/social-auth/google#3-creating-a-google-oauth-app)
- Adding Environment Variables (https://wasp-lang.dev/docs/auth/social-auth/google#4-adding-environment-variables)
If you're still having trouble, it might be helpful to check your main.wasp file and ensure that your Google userSignupFields and configFn match the latest implementation as shown in the OpenSaas repository (https://github.com/wasp-lang/open-saas/blob/main/app/src/server/auth/setUsername.ts#L29-L39).
Please note that these instructions are specific to Wasp and may not directly apply to your deployment on Netlify and AWS EC2.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @DavidFeng, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:
Perhaps try again in 15mins?@DavidFeng this likely comes down to not setting correctly the env vars on the server (on your EC2 instance), or not configuring something correctly in your Google app. Most likely the former!
@martinsos Thanks for the feedback! I have reloaded several variables and still had no luck. Are there any suggestions to which variables might be problematic? I changed the google auth variables but the same issue is still occurring đ
Since the issue is happening on a get request to the front end, I am a little bit confused on whatâs going on
Additionally, when I try to directly enter https://myapp.netlify.app/oauth/callback, it gives the Netlify âpage not existâ error page. When I enter http://localhost:3000/oauth/callback in the local dev environment, however, it brings me to the ai demo app page (if I signed in) or to a error page still with the web appâs nav bar (if I did not sign in)
Wohooo @DavidFeng, you just became a Waspeteer level 1!
This leads me to hypothesize that the front end code might just be built incorrectly. Does this auth/callback URL correspond to a webhook or a file? (I am new to this so sorry in advance for the dumb question) Any suggestions on how to debug it?
Finally, I looked at the server logs and noticed that in the dev environment, the last get request on the server is server.com/auth/google/callback?state=XXX&prompt=consent, while in the deployed environment the last get request is server.com/auth/google/callback?state=XXX&prompt=none, not sure if that is relevant
@kapa.ai Any thoughts based on the provided context?
Let me check the knowledge base for you again. One moment! :books:
----------------------
I'm sorry, but as an AI, I can only provide information based on the knowledge sources provided. In this case, I don't have enough information to give you a confident answer about the Google Auth redirection issue you're experiencing on Netlify and AWS. I recommend checking the official Wasp documentation or reaching out to the Wasp community for further assistance.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @DavidFeng, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:
Perhaps try again in 15mins?
Hmm tired to run the built version for front end locally and http://localhost:3000/oauth/callback also brings me to the app or the error page. Seems like there is something wrong with either the router or building the oauth callback page. This bug is quite mysterious so far, not sure what could have gone wrong. Any advice is appreciated!
I was originally building the app on push not through the Netlify CLI's terminal command, but through linking Netlify with the Git Repo and using a hacky deploy command through their web interface on each Git push:
For some reason, this does NOT build the
OAuthCallbackPage correctly and results in the issue.
The issue is fixed when I switched to using the Netlify CLI's terminal command in Github Actions to deploy. I have uploaded my Github Action file for deploying frontend to https://github.com/wasp-lang/wasp/issues/2344#issuecomment-2421811029GitHub
Google Auth Redirection Not Working (Netlify & AWS) ¡ Issue #2344 ¡...
Describe the bug I am currently trying to deploy an app built with Open-Saas on Netlify and AWS EC2 instance with Nginx. Everything was working in the developer environment, but when I try logging ...
The original issue is closed but I think it would make sense in the Docs to explicitly mention to NOT deploy through the Netlify auto deploy on push option on the Netlify website, which seems very tempting since it is a lot less work than typing up a Github Action yml file. This is generally the default option for most people building site there).
If possible, I would like to update the docs myself - I think this project is really cool and am excited to contribute to it! However, I'm not sure if this issue only applies to projects built upon the Open Saas template, or whether it applies to all Wasp projects in general. If I am to update the docs, should I update the docs for the Open Saas project or just for Wasp?
Hey @DavidFeng , sorry that i didn't respond sooner and for the trouble you had to go through!
Based on all the stuff that you figured out, the likely error is the fact that Netlify, when you use the first approach, doesn't redirect URLs toward index.html, but instead returns 404. Netlify needs ot be configured correctly, so it redirect any request to index.html, and Wasp by default comes with netlify.toml file, in .wasp/build/web-app, that configures Netfliy in such way. I am guessing that when you were doing it via Netlify's auto deploy on push, those settings were probably not getting picked up?
Possibly useful issue for you, on our Github: https://github.com/wasp-lang/wasp/issues/1982 .
If you would be up with heplnig us document/improve this, tha twould be awesome! And you asked a good question -> this is not OpenSaas specific, but indeed Wasp specific, so this would be modification to Wasp's docs.
GitHub
Properly document our client deployment ¡ Issue #1982 ¡ wasp-lang/w...
In production, our client is just a bunch of static files. When you input a non-existent file path into the address bar (or the browser tries to redirect to it), the navigation fails with a 404 - n...
@martinsos Hi, I have submitted a pull request at https://github.com/wasp-lang/wasp/pull/2347. Let me know what you think!
GitHub
Build software better, together
GitHub is where people build software. More than 100 million people use GitHub to discover, fork, and contribute to over 420 million projects.
Awesome, thakns for this, I reviewd it! https://github.com/wasp-lang/wasp/pull/2347#pullrequestreview-2388423342
Hi, thanks for the feedback! Iâve resolved the comments. Would you mind taking a look?
@DavidFeng , awesome, i will! We are on our yearly retreat at th emoment but I will take a look at it once we come back!