Preserving Query Parameters in Google Social Auth Redirects
I'm currently integrating Google Social Auth into our application. In certain instances, our login URLs contain query parameters. After users successfully authenticate through Google, we need to ensure that any query parameters from the original URL persist in the redirect URL.
For instance, if a user clicks on the following link without an active login session:
https://my-application/chat?message=hello
The user is redirected to Google auth. Upon successful authentication, they're redirected back to:
https://my-application/chat (because of onAuthSucceededRedirectTo: "/chat" in the main.wasp)
However, i would it to redirected back to:
https://my-application/chat?message=hello
How can we configure this behaviour in WASP?7 Replies
@miho could you check this one out pls?
I don't think we expose a way to propagate the query params via backend all the way to the
/chat page unfortunately.
One thing you could do is use the localStorage:
1. When people land on the login page, save the query params in the localStorage
2. After the login is completed, on the /chat page you retrieve the data from the localStorage
To make things a bit more secure, make sure to delete the data from localStorage after you read them from on the /chat page.
In the future:
In the future, we'll probably want to enable users to achieve the same thing via propagating the query params through the chain of redirects:
LoginPage -> our backend -> Google backend -> our client -> our backend again -> redirect on success page
We'll rework the OAuth in the near future (we'll start using Artic from the Lucia auth lib family) and then we can improve on this. I can't give an ETA for this, but this year, sometime 😄Some time ago when I was building some apps, I often wanted this same feature. Actually, what I wanted was for login to preserve the original URL (with query and all). So if user wanted to visit URL X, but was redirected to login, I would love them to come back to X, whatever the X was.
This is something we could support I think, a lot of apps could use that as a good default!
GitHub
Support redirecting user to their initial URL after successful logi...
Would be great if login could preserve the original URL (with query params and all). So if user wanted to visit URL X, but was redirected to do login, I would love them to be redirected to X after ...
Hi @miho :
Thank you for your suggestion. However, there's a challenge with implementing it. When users land on the chat page (without an active login session) with query parameters (e.g., "https://my-application/chat?message=hello"), they're immediately redirected to "https://my-application/login", resulting in the loss of query parameters before we can save them to localStorage.
I tried to save the query params before the redirection to /login route but it didn't work out.
Do you have any alternative suggestions for preserving query parameters during the redirect process? Is there any other workaround I could use until this issue is fixed?
One thing you could do is: not use
authRequired: true in the Wasp file, but instead use the useAuth hook which would give you the ability to:
1. Check if the user is logged in when the page loads, if yes, then let them through
2. If not, first save some params and then redirect using the <Redirect /> from react-router-dom lib
We have an example for using useAuth + Redirect here: https://wasp-lang.dev/docs/auth/social-auth/overview#3-showing-the-correct-state-on-the-clientOverview | Wasp
Social login options (e.g., Log in with Google) are a great (maybe even the best) solution for handling user accounts.
Thanks 🙂