After clicking “log in” in my site header, I want the user to be redirected to a login page where they can log-in using Google Oauth, and then be redirected back to the page they were first visiting when they first clicked “log in” in the header.
Unfortunately, Google Oauth is very strict about the URL that the user is coming from when logging in which is hindering all the solutions that I can come up with.
Has anyone had experience with this or has any tips for achieving my desired result? Thanks
My main problem is getting Bubble to temporarily store the URL that I would like to redirect the user to after they have logged in.
I can’t store the URL in a ‘state’ on the page because Google OAuth directs the user away from the site while logging in and clears the page’s states.
I can’t store the URL on the unlogged-in user using the Database because after they return from logging in, the database information doesn’t carry-over from when they were logged out.
I can’t store the URL as a parameter on the login page address because google OAuth is too strict and won’t let you log in if the address is not exactly correct.
Perhaps there is another way to store the URL until after the user is logged in? I think storing it as a cookie would work but it feels complicated and I’ve not messed with that stuff before so would prefer a more simple method if possible.
Storing URL as a parameter is possible. I use it on my login page like shown below. After google login is done, the page is refreshed with same parameters and hence you can use those.
In the workflow that you have on Oauth login, after the action of “sign-up/login”, you can have other actions which are actually executed after user logs in. Not sure how Bubble does it. Maybe Bubble makes a note of these actions and then performs in the backend. Not sure. Here is how it is in my setup.
Now it is possible that these actions might be getting executed every time irrespective of whether login worked or not. I haven’t tested that part. For me anyway it doesn’t matter as if the login failed then subsequent actions would work on null object.
Google OAuth won’t let the user log in if the URL they are coming from is not the exact URL that has been set up in the google developer console. Otherwise they get a “redirect_URI_mismatch” error when trying to log in.
If I send the ‘target url’ as a parameter to my Login page, it changes the URL of my login page because it adds that parameter onto the end of the URL
Solved this ‘temporarily storing the URL’ problem by installing the “local storage and cookies” plugin which stores the URL as a local browser cookie rather than in Bubble’s database or in page states.
If anyone runs into the same problem and needs more help, let me know and happy to provide more details.
Clearly is working for you so really not sure what was going wrong on my end with my app!
Whenever a user tries to log in with Google from a URL that has parameters, or anything different from the URL I’ve set up in google developer console, they get this error:
Should I have set up my settings in google dev console differently? Not sure how to allow ‘any’ URL to log in rather than just the specific ones i’ve added to Google dev console.
And you do not want to share the error. How does one help with that?
