Angular 17项目冻结无点击响应，刷新恢复求排查方案

问题描述 #

我的Angular 17.3.8项目会出现冻结问题，点击任何操作都完全无响应，刷新页面后即可恢复正常，但控制台及其他位置均未出现报错信息。项目按功能划分领域文件夹，每个文件夹包含对应模块与路由模块，现附上项目中的Resolve结构、目录层级及技术栈信息，恳请提供排查思路或解决方案。

技术栈 #

• OAuth2
• SpringBoot 3.3.2
• Angular 17.3.8

Resolve代码 #

import { Injectable } from '@angular/core';
import { ActivatedRouteSnapshot, Router, RouterStateSnapshot } from '@angular/router';
import { Observable } from 'rxjs';
import { AbstractResolve } from '../../../../shared/resolvers/abstract-resolve';
import { AppStore } from '../../../../shared/utils/app.store';

import { ***** } from './*****.service';

@Injectable()
export class *****Resolve extends AbstractResolve {

  constructor(private service: *****, 
              router: Router, 
              appStore: AppStore) {
    super(appStore, router);
  }

  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<*****> {
    return this.resolveAction(this.service.get(route.paramMap.get('id')));
  }
}

目录层级 #

hierarchy
src
└── app
    ├── 
    ├── app.component.css
    ├── app.component.html
    ├── app.component.ts
    ├── app.module.ts
    ├── app-routing.module.ts
    └── core.module.ts

排查思路与解决方案建议 #

• 检查Resolve异步流是否阻塞：Resolve依赖resolveAction处理service.get()请求，若该请求的Observable从未完成（比如后端接口挂起、未正确完成订阅），会导致路由一直处于等待状态，阻塞页面交互。可添加超时逻辑定位问题：

  import { timeout } from 'rxjs/operators';
  
  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<*****> {
    return this.resolveAction(this.service.get(route.paramMap.get('id')).pipe(
      timeout(5000) // 5秒超时后抛出错误，便于排查是否是接口阻塞
    ));
  }
  

• 核验AbstractResolve实现逻辑：检查AbstractResolve中的resolveAction是否存在未处理的错误或无限订阅，比如是否在出错时正确导航、释放资源，避免线程阻塞。
• 检测主线程阻塞情况：用浏览器DevTools的Performance面板录制操作流程，查看是否有长时间运行的任务（如大量循环、未优化的DOM操作）占用主线程，导致页面无响应。
• 排查OAuth2认证异常：OAuth2的token静默刷新逻辑可能存在隐性阻塞，确认token刷新的异步操作是否正确处理，无死锁或未完成的Promise/Observable。
• 检查路由懒加载问题：若领域模块采用懒加载，排查路由配置是否存在循环依赖或静默加载失败的情况，可尝试关闭懒加载验证问题是否消失。
• 检查AppStore状态管理：AppStore中的状态更新若存在大量同步处理，可能阻塞主线程，建议将耗时操作移至异步线程执行。

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