时间戳

首页 > 解决方案 > React SPA 中的 msal - 使用从 AcquireTokenRedirect 收到的访问令牌

reactjs - React SPA 中的 msal - 使用从 AcquireTokenRedirect 收到的访问令牌

问题描述

我有一个 React SPA，我正在使用 msal 使用 loginRedirect 对 Microsoft 用户进行身份验证。登录后，我使用acquireTokenSilent 静默获取访问令牌以调用Web API。当获取访问令牌失败并且需要交互时，我正在使用acquireTokenRedirect。

当我使用acquireTokenRedirect 时，我看到的是： 1. 用户被重定向到login.microsoftonline.com。2. 返回一个 302 响应，带有包含重定向 url + 访问令牌的 Location 标头。3. 对我的重定向 url 的 GET 请求 - 我的回调被调用。4. 另一个重定向到我的应用程序根目录。

最后一次重定向使我的应用程序再次被提供服务，并且我从应用程序的状态中丢失了访问令牌。此外，我失去了将用户重定向到特定路线的能力。

获取访问令牌：

getAccessToken = async () => {
    let accessTokenRequest = { scopes: [...]
    };
    try {
      var accessTokenResponse = await 
      this.authAgent.acquireTokenSilent(accessTokenRequest);
      return accessTokenResponse.accessToken;
    } catch (error) {
      const errorCode = error.name;
      if (errorCode === "consent_required" || errorCode === "interaction_required") {
        await this.authAgent.acquireTokenRedirect(accessTokenRequest);
      }

      throw error;
    }
  };

标签： reactjsazureazure-active-directorysingle-page-applicationmsal

解决方案

为了避免额外的重定向，我需要做的是将 Auth 配置中的“navigateToLoginRequestUrl”参数设置为 false。这解决了我的问题。

推荐阅读