Support firebase's redirect_url https://xxx.firebaseapp.com/__/auth/handler

[brunolemos]

So, I have an Android & iOS app:

• iOS redirect_uri is http://appname://oauth
• Android redirect_uri is http://localhost/github

If two redirect_uri are required, I have to to create two oauth applications on GitHub. Firebase project console only supports 1 clientId and 1 clientId per provider.

How to have a iOS & Android application with only 1 firebase project and 1 oauth application?

I believe a single redirect_url is the answer. Firebase provides the https://xxx.firebaseapp.com/__/auth/handler.

Is that possible?

[auser]

Sadly, I don't think it is because how would your application get reopened with the token? It might be possible if you can trigger firebase to get passed the application URL, but without resolving the request... maybe through a push notification?

Other than that, I can say it breaks the oauth flow. I doubt we will be able to support that ability. Definitely would consider a PR, though.

[brunolemos]

@auser When I was looking at this other day, I found this:

onMessage function

A function that is invoked when the webview calls window.postMessage. Setting this property will inject a postMessage global into your webview, but will still call pre-existing values of postMessage.

window.postMessage accepts one argument, data, which will be available on the event object, event.nativeEvent.data. data must be a string.

Turns out the firebase handler url call this window.postMessage method and that's how we could get it from the react native app.

[auser]

True. I also thought of another method of handling it too using a custom oauth provider.

When I'm not driving back from Tahoe, I can detail it a bit more.

[auser]

In addition, both platforms have native calls that can receive postMessage messages

[brunolemos]

In addition, both platforms have native calls that can receive postMessage messages

Do you mean it wouldn't be necessary to use the webview component? Can you elaborate?

[auser]

Sure. Short typing due to traveling.

The oauth methods are handled by native libraries, which handle dealing with the web view (necessary component). We can intercept the postMessage between web view and the native call, so in addition to supporting an all-client side solution, we can intercept the response if generated by a postMesage.

[brunolemos]

@auser For a faster solution, can't the android redirect uri be appname://oauth too?

If not, why? Android supports it as well.

[beaneyDev]

What about if you have an app and a website that use the same firebase DB/GitHub signup? The proposed solution of having appname://oauth won't work because the website requires that the OAuth method calls back to firebaseapp.com/__/auth/handler

I considered putting a middleman service in between, as GitHub allows different redirects providing they are on the same domain, e.g.

http://beaney.com/index.php http://beaney.com/index2.php

Where index.php redirects to firebaseapp.com/__/auth/handler and index2.php would call back to appname://oauth.

But I can't get the website one working. No idea what to pass into it as this is obscured from view.

Any ideas?

[brunolemos]

@beaneydev I'm using this https://github.com/brunolemos/micro-oauth

You can pass the callback URL like this: https://url-generated.now.sh/callback?callback_url=CALLBACKHERE I think

[beaneyDev]

Okay I think I have a solution. The implementation is hacky as hell but I think it could be refined a little:

1. User clicks sign in at mb-react-todo.herokuapp.com (ReactJS front end)
2. mb-react-todo.herokuapp.com attaches a callback to the window that takes an access token and authorises in Firebase.
3. Popup is opened that goes to the GitHub auth URL.
4. GitHub callback goes to oauth-forwarder.herokuapp.com (PHP web service I created).
5. oauth-forwarder.herokuapp.com makes POST request to github.com/login/oauth/access_token with the code passed by GitHub auth service.
6. oauth-forwarder.herokuapp.com then redirects (still in the popup) to mb-react-todo.herokuapp.com/?accessToken={ACCESS_TOKEN_FROM_POST}
7. Now in the popup we are on the same origin/domain as the parent, so we can pass the accessToken to that parent via window.opener callback.

So that's how I'm handling the website.

Then app side - I do something similar but specify https://oauth-forwarder.herokuapp.com/redir_mobile.php, which redirects to mb://?code={CODE}.

GitHub sucks.