Angular 4 基于ADAL（ng2-adal）的id_token刷新问题咨询

我之前也碰到过类似的ng2-adal token过期处理的坑，结合你的路由守卫场景，给你整理一套实用的解决方案，既能准确检测token过期，又能优化用户登录后的跳转体验：

完善后的AuthGuard实现 #

首先是优化后的路由守卫代码，这里加入了token过期的主动检测，还支持静默刷新token的逻辑：

import { Injectable } from '@angular/core';
import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { AdalService } from 'ng2-adal/core';

@Injectable()
export class AuthGuard implements CanActivate {

  constructor(private adalService: AdalService, private router: Router) {}

  async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<boolean> {
    // 先判断当前是否处于已认证状态
    if (this.adalService.userInfo.authenticated) {
      try {
        // 尝试静默刷新token——这一步会自动处理即将过期的token，不用用户手动登录
        await this.adalService.acquireTokenSilent(this.adalService.config.clientId);
        // 刷新成功后更新本地用户信息
        this.adalService.getUser();
        return true;
      } catch (error) {
        // 静默刷新失败，说明token已经彻底过期，必须跳转登录
        this.adalService.login(state.url);
        return false;
      }
    } else {
      // 未认证状态直接跳转登录，同时保存当前路由，登录后自动返回
      this.adalService.login(state.url);
      return false;
    }
  }
}

关键逻辑说明 #

• 双重认证校验：不仅依赖ADAL自带的userInfo.authenticated状态，还通过acquireTokenSilent主动校验token有效性，避免本地缓存状态与实际token过期情况不一致的问题。
• 静默刷新优化：调用acquireTokenSilent会尝试在后台刷新token，用户完全无感知，只有当刷新失败（比如token已过期太久）才会触发跳转登录，大幅提升体验。
• 保留原路由：调用adalService.login(state.url)时传入当前要访问的路由地址，用户登录成功后会自动跳回这个页面，不用重新导航。

额外注意事项 #

1. 回调处理：记得在AppComponent的ngOnInit里添加AD登录回调的处理，确保token和用户信息能正确更新：

ngOnInit() {
  this.adalService.handleWindowCallback();
}

2. 路由配置：把你的AuthGuard添加到需要保护的路由配置中：

const routes: Routes = [
  { path: 'admin', component: AdminComponent, canActivate: [AuthGuard] },
  { path: 'profile', component: ProfileComponent, canActivate: [AuthGuard] },
  // 其他需要认证的路由...
];

3. ADAL配置检查：确认你的ADAL配置里redirectUri和postLogoutRedirectUri设置正确，否则登录后可能无法跳回应用。

内容的提问来源于stack exchange，提问作者Aiguo