如何让MSAL-React子站点复用同域Azure AD主站的AccessToken以跳过登录流程？

我来帮你梳理下这个问题的核心点和解决思路：

首先，你当前的做法（把token存到sessionStorage就跳过MSAL）之所以没效果，是因为MSAL-React的登录状态完全依赖自身内部的账户和令牌缓存，你自己存到sessionStorage的token，MSAL实例根本“看不到”，所以它依然会认为用户未登录。

核心结论： #

只靠一个AccessToken本身是不够的，你需要把这个token和对应的用户账户信息导入到MSAL的缓存系统中，让MSAL识别到用户已登录的状态。

具体解决步骤： #

1. 验证AccessToken的有效性：
   不能直接信任cookie里的token，得先检查它是否过期，以及签名是否合法（避免篡改风险）。建议用jose这类安全的JWT库来解码和验证，不要用JSON.parse(atob(...))这种不安全的方式。

2. 解析Token获取用户/租户信息：
   AccessToken是JWT格式，里面包含了用户ID（sub）、租户ID（tid）、用户名（preferred_username）等核心信息，这些是创建MSAL账户对象的必备数据。

3. 将账户信息导入MSAL缓存：
   用解析出的信息创建一个符合MSAL AccountInfo 类型的对象，然后添加到MSAL实例的账户缓存中，并设置为活跃账户。

4. 将AccessToken导入MSAL令牌缓存：
   把cookie里的AccessToken存入MSAL的令牌缓存，让MSAL后续可以直接使用这个令牌发起请求，而不是重新获取。

针对你代码的修改示例： #

先安装jose库（用于安全处理JWT）：

npm install jose

然后修改你的useEffect逻辑：

import { decodeJwt, jwtVerify } from 'jose';
import { AccountInfo } from '@azure/msal-browser';

useEffect(() => {
  const initializeAuth = async () => {
    try {
      const getCookieValue = (name: string) => {
        const value = `; ${document.cookie}`;
        const parts = value.split(`; ${name}=`);
        if (parts.length === 2) return parts?.pop()?.split(';').shift();
        return null;
      };

      const tokenFromCookie = getCookieValue('accessToken');

      if (tokenFromCookie) {
        console.log('Using token from cookie');
        
        // 1. 解码Token获取Claims
        const decodedToken = decodeJwt(tokenFromCookie);
        
        // 2. 验证Token是否过期
        const isTokenExpired = decodedToken.exp && Date.now() >= decodedToken.exp * 1000;
        if (isTokenExpired) {
          console.error('Token from cookie has expired');
          // 过期的话走正常登录流程
        } else {
          // 3. 验证Token签名（可选但推荐，确保Token合法）
          const jwks = await fetch('https://login.microsoftonline.com/common/discovery/keys').then(res => res.json());
          const publicKey = await jose.createRemoteJWKSet(new URL('https://login.microsoftonline.com/common/discovery/keys'));
          await jwtVerify(tokenFromCookie, publicKey, {
            issuer: `https://login.microsoftonline.com/${decodedToken.tid}/v2.0`,
            audience: msalConfig.auth.clientId // 确保Token的受众和当前ClientID一致
          });

          // 4. 创建MSAL账户对象
          const account: AccountInfo = {
            homeAccountId: `${decodedToken.tid}.${decodedToken.sub}`, // 租户ID.用户ID，MSAL的唯一标识
            environment: 'login.microsoftonline.com',
            tenantId: decodedToken.tid,
            username: decodedToken.preferred_username || decodedToken.email || '',
            localAccountId: decodedToken.sub,
            name: decodedToken.name || '',
            idTokenClaims: decodedToken,
            // 其他可选字段如果没有可以留空，MSAL会自动处理
          };

          // 5. 将账户添加到MSAL缓存并设置为活跃账户
          instance.setAccount(account);
          instance.setActiveAccount(account);

          // 6. 将AccessToken存入MSAL令牌缓存
          const tokenCache = instance.getTokenCache();
          await tokenCache.addAccessToken({
            homeAccountId: account.homeAccountId,
            environment: account.environment,
            credentialType: 'AccessToken',
            clientId: msalConfig.auth.clientId,
            secret: tokenFromCookie,
            realm: decodedToken.tid,
            target: decodedToken.scp || '', // Token的权限范围，要和你的loginRequest一致
            expiresOn: new Date(decodedToken.exp * 1000),
            extendedExpiresOn: new Date((decodedToken.exp || 0) * 1000),
          });

          // 7. 存入sessionStorage（如果你的业务需要，不是必须）
          sessionStorage.setItem('accessToken', tokenFromCookie);
          setIsInitialized(true);
          return;
        }
      }

      // 下面是原有的MSAL正常登录流程
      await instance.handleRedirectPromise();
      const accounts = instance.getAllAccounts();

      if (accounts.length > 0) {
        instance.setActiveAccount(accounts[0]);
        setIsInitialized(true);
      } else {
        try {
          const silentRequest = {
            ...loginRequest,
            redirectUri: window.location.origin + '/oauth2/redirect',
          };

          const response = await instance.ssoSilent(silentRequest);
          console.log('Silent login success', response.accessToken);
          sessionStorage.setItem('accessToken', response.accessToken);
          instance.setActiveAccount(response.account);
        } catch (error) {
          console.error('Silent login failed, falling back to redirect', error);
          // 这里可以触发重定向登录
          // instance.loginRedirect(loginRequest);
        }
      }
    } catch (error) {
      console.error('Auth initialization failed:', error);
    } finally {
      setIsInitialized(true);
    }
  };

  initializeAuth();
}, [instance]);

额外注意事项： #

1. Cookie的跨子域访问：
   确保主站设置accessToken cookie时，domain属性设为父域（比如.example.com），这样子站（app.example.com）才能读取到这个cookie；同时SameSite属性最好设为Lax（同域场景下足够），不要设置HttpOnly: true（否则前端JS读不到）。

2. 优先考虑MSAL原生的SSO：
   其实你提到的ssoSilent应该能自动实现同域SSO，不需要手动读cookie。如果它没起作用，可能的原因是：

   • 主站的Azure AD cookie（ARRAffinity、ESTSAUTH等）的domain设置不对
   • MSAL配置的authority、clientId和主站完全一致（你说共享ClientID，这部分是对的）
   • ssoSilent的loginHint可以填用户的邮箱，提升静默登录成功率

3. 令牌权限一致性：
   确保主站的AccessToken的scp（权限范围）包含子站需要的权限，否则即使导入成功，后续API请求也会失败。

备注：内容来源于stack exchange，提问作者John