New Plugin: OAuth Redirect Repair - Redirect URI's Should always be in your control!


A10-1 OAuth Redirect Repair

Has a redirect URI made custom URL paths and parameters an issue for your app? OAuth Redirect Repair can solve this for you!

Place the Prepare Redirect Action right before your Sign into A Social Network action. Set your registered URI & a return URL using the dynamic field’s in the “Prepare Redirect” action.

Now create a new blank page & make the name the same as the page name provide in the services URI panel, and place a "When Page is Loaded and use the action “After OAuth Flow”. That’s it!

Eg. if you use Google and provide yoursite.bubbleapps.io/oauth as the URI, then when you create your blank page call it oauth.

Say a user is on a dynamic page and you want them to signin with an OAuth provider, you run:
image

Now the very next action would be “Sign in/up to a social network”. Then on the new blank page its as simple as dropping this:

image


Get the plugin HERE

5 Likes

Nice!
What’s the use case for “prevent back button?”

This can be used for many reasons, I myself use this when I need to stop the user from easily tapping the back button - even a webview wrapper could benefit if you did not have access to add java to prevent this.

Having some trouble using this with MS Graph:
The MS Graph oAuth is via app connector and works fine when setup traditionally.

Initial page has workflow (on button click):
Step 1) Prepare redirect (Actual: /ms-login, Return /Dashboard)
Step 2) Login social network MS-Graph

ms-login page has workflow (on page load)
Step 1) After Oauth Flow

Dashboard page has workflow (on page load and no user logged in)
Steph 1) Redirect to initial page

The above setup doesn’t work, the plugin redirects to ms-login, proceeds to MS for login, and returns with a session id, so I am pretty sure the login is performing correctly.

Change it so the flow is,

Prepare - goto ms-login page (just leave the page blank) - on page load them trigger signup/login followed by an after oauth flow.

Let me know how you go.

So setup now is:

Initial page has workflow (on button click):
Step 1) Prepare redirect (Actual: /ms-login, Return /Dashboard)
Step 2) Navigate to page /ms-login

ms-login page has workflow (on page load)
Step 1) Login social network MS-Graph
Step 2) After oAuth Flow

Dashboard page has workflow (on page load and no user logged in)
Steph 1) Redirect to initial page

When setup as above the login loses its previous pages “prepare redirect URL” and performs the login as conventional method, including sending the current page’s URL including any parameters, which is one thing I am trying to avoid.

Also, after login, once I land back on the /ms-login page I get redirected back to the MS login a second time.

I just tried to use this and I’m having trouble:

On this sign up page I have:
When google login is clicked:

  1. Prepare Redirect
    Actual URI Path: /oauth
    Return to URL: /sign_up_start
  2. Login in with Google

On the /oauth page I have
When page is loaded

  1. After OAuth Flow

So the oauth is working and user correctly lands on the /sign_up_start page but they are not logged in.

What am I doing wrong?

A sample app with this working would really help.

I will put a sample together as soon as i get a free minute. Hopefully tomorrow i will have it here for you guys. Cheers

2 Likes

Ok guys I have changed a couple of things, here is the flow:

  • Create a new blank page. Place a "When Page is Loaded event and use the action “After OAuth Flow”

  • In this action’s Confirmed Login box place the dynamic value “Current User’s Google’s Email is not empty”.

  • The very next action should be “Sign user into a social network”, and in the “Only When” box placing “Current User’s Google’s Email is empty”.

oauth2

  • Now go to the page you wish to start the users login from, place the “Prepare Redirect Action” followed by a “Go To Page Action” & set its page to your Blank Page.

  • Set your registered URI & a return URL using the dynamic field’s in the “Prepare Redirect” action.

Eg. if you use Google and provide yoursite.bubbleapps.io/oauth as the URI, then when you create your blank page call it oauth.

Let me know if you have dramas with any other providers.

1 Like

@jarrad - thanks for the update. I was able to follow this and make it work.

However, I am trying to capture some additional information about the user as part of the sign up workflow. For example: user zip code (which they enter before clicking ‘Sign up with Google’. See the implementation I have for Facebook in the screenshot below.

Is there a way for your plugin to support additional workflow actions as part of the sign-up process (from the page that signup occurs)?

By the way, Facebook is going to turn on strict URI redirect (same as Google) in early March 2018. So I would expect that demand for your plugin would go up then.

This is something that i could add no problem. When i get a minute i will add the feature.

Really? I assumed that this would not be possible since you need to navigate to another page to run the oAuth (and we cannot carry data to the other page unless it’s through the URL).

But if you say its possible, I look forward to it =)

Thats the same as leaving the entire site to oauth and the plugin magically knows what page to take you back to right? :slight_smile: Its possible just got to get a minute to make the upgrade.

Well, it’s actually going back to the same page* AND continuing the workflow from the same spot (the same way the native bubble plugin works).

So for example, we cannot use a ‘navigate to page’ workflow to go to the oauth page because it’s not possible to add workflow actions after that action.

I also need to capture information from other fields on the page* (which will be lost when you navigate away), but I can possibly store these in the URI when we come back to the page*.

Note: page* = page where the ‘Sign up with Google’ button is.

So the simple answer would be, i give you the ability to have values go out with the oauth and on return you setup a when “OAuth Redirect Repair’s - was sent with extra values” condition is true work flow, put your additional steps in that flow and grab the data from the plugin that you asked to be sent…

Yes that sounds perfect. Looking forward to the update.

@jarrad - will you have time to work on this soon?

Appreciate your help. I am happy to subscribe and recommend your plugin to others =)

Hey @rushabh I will be honest with you, I was hoping to hold off until bubble allow server side as i have already got hundreds of plugins to migrate and this will be another once its open. That said if its stopping your apps progression I can get it going through a few different methods. In the mean time its worth thinking about maybe using this to store the values,

Thanks for the details. I will check out that plugin. Currently, this is preventing me from implementing google sign on which I can live with.

The bigger concern is that Facebook is going to force everyone to do strict URI redirects in March (I’m not sure which date exactly), which will break my sign up and login flows.

If you think you can update the plugin before March – that would be really awesome and I’ll wait. The way you are proposing to implement it (with sates), seems like the correct way based on my reading.