Directly redirect to AAD login page on hitting the URL in browser

Question

Using MSAL 2.0 in React we can easily achieve redirect to login page using below methods

1. Login with pop-up
2. Login with redirect

But both the methods can be performed on a login/signin button action.

In my case, I want to redirect my React app directly to login page, when the URL is hit in the browser i.e. without button action.

Also, while doing the redirect I also need to pass my multiple scopes, for user consent.

I did some research but didn't found any feasible solutions. Please can anyone help me with this ?

Answer 1

When an application starts it always start with the app.js. In the app.js class constructor you can check your token if it is valid/invalid and or if expired.

In order to redirect your React app directly to login page try this:

state = {
  show: false;
}

componentWillReceiveProps(nextProps) {
  if (nextProps.children !== this.props.children) {
    this.checkAuth();
  }
}

componentDidMount() {
  this.checkAuth();
}

checkAuth() {
  Api.checkAuth()
  .then(result => {
    if (result.success) {
      this.setState({ show: true });
    } else {
  return <Redirect to='/login'  />
    }
  });
}