Trying to implement ADAL (Azure AD) in Javascript, keep getting a login/redirect loop

So I've got to create a calendar in html that gets events from Outlook and then deploy that as a custom page to Sharepoint, so it can be included as a webpart/iframe in site collections.

The problem is that I've tried adding ADAL security because you need to be logged in & send a token to Microsoft Exchange Online API in order to get calendar events etc. To display the calendar part, I'm using FullCalendar.io .

Now I've been keep getting a login/redirect loop that never ends. Does anyone see the fault in code? Here it is:

var $this = this;

$(document).ready(function() {
debugger;

window.config = {
      tenantId: {tenant},
      clientId: {clientid},
      popUp: true,
      callback: callbackFunction,
      redirectUri: {custom aspx page URL on our Sharepoint},
      cacheLocation: 'localStorage'
};

var authenticationContext = new AuthenticationContext(config);

authenticationContext.handleWindowCallback();

function callbackFunction(errorDesc, token, error, tokenType) {
  alert('callbackFunction reached!');
}
var items = null;

if (authenticationContext.TokenCache) {
  items = authenticationContext.TokenCache.ReadItems();
}

if (authenticationContext['_user']) {
  authenticationContext.acquireToken(config.clientId, function (errorDesc, token, error) {
    if (error) { //acquire token failure
      if (config.popUp) {
          // If using popup flows
          authenticationContext.acquireTokenPopup(config.clientId, null, null,  function (errorDesc, token, error) 
{});
      }
      else {
      // In this case the callback passed in the Authentication request constructor will be called.
          authenticationContext.acquireTokenRedirect(config.clientId, null, null);
      }
    }
    else {
      //acquired token successfully
      // alert('token success');
      $this.DisplayEvents(token);
    }
  });
}
else {
    // Initiate login
    authenticationContext.login();
}
 });

 function DisplayEvents(adalToken) {
$('#calendar').fullCalendar({
  header: {
    left: 'prev,next today',
    center: 'title',
    right: 'month,agendaWeek,agendaDay,listWeek'
  },
  navLinks: true, // can click day/week names to navigate views
  editable: true,
  eventLimit: true, // allow "more" link when too many events
  events: function(start, end, timezone, callback) {
    var headers = new Headers();
    var bearerToken = "Bearer " + adalToken;
    headers.append('Authorization', bearer);
    var options = {
      method: 'GET',
      headers: headers
    };
    var exchangeEndpoint = 'https://outlook.office.com/api/v2.0/me/events';

    fetch(exchangeEndpoint, options).then(function (response) {
      alert('Response data from successful call: ' + response);
    });
  }
});
 }  

So the code does get to "acquire token" and then the last "else", so "$this.DisplayEvents(token)" does get called! However, after acquire token, the app just keeps redirecting forever and ever... The Reply URL in my Azure AD App registration is also the window.config redirectURL value, or else I'd get an error stating the reply URL's don't match between request and Azure.

Does anyone know where it's going wrong?

Answers:

Answer

I can reproduce your issue on my side by using your code. If you use authContext.getCachedUser() to check login status, redirect issue will disappear.

if (authContext.getCachedUser()) {
        authContext.acquireToken(config.clientId, function (error, token) {
            if (error) { //acquire token failure
                if (config.popUp) {
                    // If using popup flows
                    authContext.acquireTokenPopup(config.clientId, null, null, function (errorDesc, token, error) { });
                }
                else {
                    // In this case the callback passed in the Authentication request constructor will be called.
                    authContext.acquireTokenRedirect(config.clientId, null, null);
                }
            }
            else {
                //acquired token successfully
                // alert('token success');
                alert(token);
            }
        });
    }
    else {
        // Initiate login
        authContext.login();
    }

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.