首页 > 解决方案 > 尝试在 Javascript 中实现 ADAL (Azure AD),不断获得登录/重定向循环

问题描述

因此,我必须在 html 中创建一个从 Outlook 获取事件的日历,然后将其作为自定义页面部署到 Sharepoint,这样它就可以作为 webpart/iframe 包含在网站集中。

问题是我尝试添加 ADAL 安全性,因为您需要登录并向 Microsoft Exchange Online API 发送令牌才能获取日历事件等。要显示日历部分,我使用的是 FullCalendar.io 。

现在我一直得到一个永无止境的登录/重定向循环。有人看到代码中的错误吗?这里是:

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);
    });
  }
});
 }  

所以代码确实到达“获取令牌”,然后是最后一个“else”,所以“$this.DisplayEvents(token)”确实被调用了!但是,在获取令牌后,应用程序只会永远重定向......我的 Azure AD 应用程序注册中的回复 URL 也是 window.config redirectURL 值,否则我会收到一条错误消息,说明回复 URL 不是请求和 Azure 之间的匹配。

有谁知道哪里出错了?

标签: javascriptazure-active-directory

解决方案


我可以使用您的代码在我这边重现您的问题。如果您使用 authContext.getCachedUser() 检查登录状态,重定向问题将消失。

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();
    }

推荐阅读