[Help wanted] Redirect flow + react-router

[ssuvorov]

Hey, I'm submitting a...

• [x] Documentation issue or request
• [x] Help wanted

Library Name

• [x] msal.js ^1.0.0
• [x] create-react-app
• [x] react-router-dom ^5.1.2

I've created a repo based on react-sample-app which uses redirection for login. But I spent a few days just trying to make it work with "react-route-dom". The main problem was to keep the user on the same URL after login redirection happens. After the page is refreshed, the router library loses the state with the previous location. As a workaround, I used localStorage. And now I'm curious, is it a better way to do so.

Repository: https://github.com/ssuvorov/MS-SSO-react-example

My flow is the following:

• Protected route checks if .getAccount() returns data. If not - the user redirects to /login.
• Login page registers a callback registerRedirectionCallback and if the .getAccount() returns nothing - auth.loginRedirect(GRAPH_REQUESTS.LOGIN) is executed.
• once the account is there it redirect the user to a previous path.
• in case API receives error code 401 I'm going to execute window.location.reload().

Questions

1. Is it possible to use auth.loginRedirect() from any path? I'd like to avoid redirection to /login. Currently, if I use login() from http://localhost:3000/protected it returns

   AADSTS50011: The reply URL specified in the request does not match the reply URLs configured for the application

2. What's the best way to stay on /protected page after redirection happens?

[ssuvorov]

I guess there is a better repo for asking this. Moved to: https://github.com/AzureAD/microsoft-authentication-library-for-js/issues/1474