Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Push frontend login into EasyAuth #78

Merged
merged 1 commit into from Jul 29, 2020
Merged

Push frontend login into EasyAuth #78

merged 1 commit into from Jul 29, 2020

Conversation

c-w
Copy link
Contributor

@c-w c-w commented Jul 29, 2020

Given that we had some issues with consistently logging in from the frontend, this pull request overhauls authentication and pushes it entirely into EasyAuth.

This entails a number of changes:

  • To ensure that all frontend traffic goes through EasyAuth, we now serve the frontend from the Azure Function via a Proxy.
  • The proxy serves the frontend at https://githubexpertsapi.azurewebsites.net/site/*. To ensure that client-side links are set correctly and this path prefix is handled transparently, a basename was added to the React Router.
  • In order to force a login, we can craft links like this: https://githubexpertsapi.azurewebsites.net/.auth/login/aad?post_login_redirect_uri=%2Fsite%2Fschedule. This will trigger the EasyAuth login flow and then drop the user into the route pointed to by the query argument.
  • To enable deep linking via the EasyAuth redirect URI argument, we switch away from HashRouter and to BrowserRouter. This also requires setting the 404 document on the static website to the React index.
  • The frontend can now make authenticated request to the backend by calling through to /api and passing credentials. Alternatively, the identity tokens can also be fetched from the URL hash after the login redirect completed. The login redirect drops the user to a URL that looks like this https://githubexpertsapi.azurewebsites.net/site/schedule#token=%7B%22authenticationToken%22%3A%22eyJhbGciOiJIU...X6wFj8%22%2C%22user%22%3A%7B%22userId%22%3A%22sid%3A9c1a0eb94448361fdb64e4c71db78563%22%7D%7D. The token URL fragment is a URI encoded JSON document that the frontend can parse to grab the required pieces of authentication information.

@c-w c-w requested a review from jeongl Jul 29, 2020
@c-w
Copy link
Contributor Author

c-w commented Jul 29, 2020

@alexgolesh @robdavisMS @steverhall @jeongl Take a look at this.

@steverhall
Copy link
Contributor

steverhall commented Jul 29, 2020

Thanks @c-w! Yikes! Why is this so hard?

@c-w
Copy link
Contributor Author

c-w commented Jul 29, 2020

@steverhall It's so hard because there's no official React integration for B2C. This project came out of CSE (split out of some ugly code I had to figure out for a project a long time ago) and it's the closest to the kind of dev experience we'd like, but no B2C support yet.

@c-w c-w merged commit de0e427 into master Jul 29, 2020
@c-w c-w deleted the fix-login branch Jul 29, 2020
@jeongl
Copy link
Contributor

jeongl commented Jul 29, 2020

This breaks the layout of the scheduler. investigating why? it was just changed to a browser router.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants