title: MSAL 2.0 JS Browser: redirects to a blank page and hangs there (no redirect back to main app)
body: <p>I am trying to implement MSAL auth via Redirect in Vue js.</p>
  <p>I have followed the official guide but when I open an app, handleRedirect is started, then it redirects to a blank page and hangs there, the console looks like this:</p>
  <ul>
  <li>handleRedirectPromise called but there is no interaction in progress, returning null.</li>
  <li>Emitting event: msal:acquireTokenStart</li>
  <li>Emitting event: msal:handleRedirectEnd</li>
  <li>Null, no response</li>
  <li>Emitting event: msal:acquireTokenStart</li>
  </ul>
  <p>I cannot get how to implement the redirect flow (popup flow is not an option).</p>
  <p>My config:</p>
  <pre><code>// login
  var msalConfig = { 
      auth: {
          clientId: clientId, 
          authority: this.authority, //https://login.microsoftonline.com/common/ default
          redirectUri: this.redirect + 'redirects/login-msal-powerbi/index.html', // blank page
          postLogoutRedirectUri: null
      }, 
      cache: {
          cacheLocation: &quot;localStorage&quot;, // This configures where your cache will be stored
          storeAuthStateInCookie: false, // Set this to &quot;true&quot; if you are having issues on IE11 or Edge
      },
      allowRedirectInIframe: true
  }
  </code></pre>
  <p>My main LoginUser function:</p>
  <pre><code>
  // login
  loginUser: function() {
      var that = this;
      // Prepare config
      this.msalInstance = new msal.PublicClientApplication(msalConfig); 
      // Register Callbacks for Redirect flow
      var request = this.msalGetRequestLoginRedirect(this.powerbi.scopes, this.login.aadTenant); // returns an object with authority and scopes
      this.msalInstance.handleRedirectPromise()
      .then(function(responce) {
          that.msalHandleResponse(responce, that.msalInstance);
      })
      .catch((error) =&gt; {
          console.log(error);
      });
  
  </code></pre>
  <p>My msalHandleResponse function:</p>
  <pre><code>msalHandleResponse: function(response, msalInstance) {
      if (response !== null) {
          console.log(response);
      }else {
          console.error('null!!') // returns null
          return msalInstance.loginRedirect({scopes:[
                      &quot;https://analysis.windows.net/powerbi/api/Dashboard.Read.All&quot;,
                      &quot;https://analysis.windows.net/powerbi/api/Dataset.Read.All&quot;,
                      &quot;https://analysis.windows.net/powerbi/api/Report.Read.All&quot;,
                      &quot;https://analysis.windows.net/powerbi/api/Group.Read.All&quot;,
                      &quot;https://analysis.windows.net/powerbi/api/Workspace.Read.All&quot;,
                      &quot;https://analysis.windows.net/powerbi/api/UserState.ReadWrite.All&quot;       
                  ], responseMode:&quot;query&quot;});
      }
  },
  
  </code></pre>
  <p>My acquireTokenRedirect function:</p>
  <pre><code>msalGetTokenRedirect: function(msalInstance) {
      var that = this;
      msalInstance.acquireTokenSilent(this.requestsObj.silentRequest)
      .then(function(tokenResponse) {
          // Optionally make something with tokenResponse    
          console.log(&quot;Access token acquired silently...&quot;);
          return tokenResponse;
      }).catch(function(error) {
          if (error instanceof InteractionRequiredAuthError) {
              // fallback to interaction when silent call fails
              return msalInstance.acquireTokenRedirect(this.requestsObj.request)
              .then(function(tokenResponse) {
                  console.log('TOKEN RESPONSE',tokenResponse);
              }).catch(function(error) {
                  console.error(error);
              });
          }
      });
  },
  </code></pre>