使用 msal.js 时保持登录状态

Question

我正在为 Microsoft ToDo 任务构建一个小型 JS 应用程序，并使用 msal.js 库来适应身份验证过程。这工作得很好，我收到一个弹出窗口，我验证了我的个人资料，弹出窗口关闭，我的任务出现在我的屏幕上。

但是：它好像不记得我之前认证过；每次我运行 webpack 应用程序并且页面启动时，它都会显示弹出窗口并要求身份验证。一旦我通过身份验证并刷新页面，它只会向我显示任务，而不会再次显示弹出窗口。我没有尝试等待一个小时，但我认为这与未正确刷新我的访问令牌有关。我对 Outlook/Microsoft API 的了解并不多，所以我可以真正确定我是否正确使用它。

简而言之：如何进行一次身份验证，以便下次启动应用程序时显示任务而无需再次进行身份验证？

我的初始化函数

  this.userAgentApplication = new Msal.UserAgentApplication(microsoftTasksClientId, null, function (errorDes, token, error, tokenType) {
    // this callback is called after loginRedirect OR acquireTokenRedirect (not used for loginPopup/aquireTokenPopup)
    console.log(token)
  })
  let user = this.userAgentApplication.getUser()
  if (!user) {
    const self = this
    // this.userAgentApplication = new Msal.UserAgentApplication(microsoftTasksClientId)
    this.userAgentApplication.loginPopup([`${this.apiRootUrl}Tasks.readwrite`]).then(function (token) {
      self.idToken = token
      user = self.userAgentApplication.getUser()
      if (user) {
        self.getSilentToken()
      }
    }, function (error) {
      console.log(error)
    })
  } else {
    this.getSilentToken()
  }

和我的 getSilentToken 函数

  const self = this
  this.userAgentApplication.acquireTokenSilent([`${this.apiRootUrl}Tasks.readwrite`]).then(function (token) {
    console.log('ATS promise resolved', token)
    self.accessToken = token
    self.getTasks()
  }, function (err) {
    console.log(err)
  })

请注意，我的代码根本没有重构！;-)

Answer 1

您使用的是哪个版本的 MSAL？0.1.1版本中存在一个问题，存储默认为“sessionStorage”，并且无法真正更改。在这种情况下，您的登录信息仅保存当前打开的窗口，即使打开新的浏览器窗口，您也将被迫重新登录。您应该使用“localStorage”来实现您想要的并将其作为 UserAgentApplication 的构造函数参数传递。

这是他们的存储库中对此的修复：

https://github.com/AzureAD/microsoft-authentication-library-for-js/commit/eba99927ce6c6d24943db90dfebc62b948355f19