ngx-extended-pdf-viewer页面刷新后间隔一段时间打开组件无法加载PDF

该故障是10.0.0-alpha.8测试版的已知问题，核心是PDFJS Worker闲置自动销毁后，测试版未适配路由场景下的Worker自动重启逻辑，且组件销毁时未正确释放旧资源导致新实例初始化失败，可按以下步骤排查修复：

• 补充组件销毁资源释放逻辑
  组件卸载时手动清空PDF实例和Worker资源，避免残留上下文影响下一次组件初始化，代码示例如下：

  import { Component, OnDestroy } from '@angular/core';
  import { NgxExtendedPdfViewerService } from 'ngx-extended-pdf-viewer';
  
  @Component({
    // 你的原有组件配置
  })
  export class PDFViewerComponent implements OnDestroy {
    pdfSrc = '';
    constructor(private pdfService: NgxExtendedPdfViewerService) {}
  
    ngOnDestroy(): void {
      this.pdfService?.destroy();
      this.pdfSrc = '';
    }
  }
  

• 禁用Worker闲置超时回收
  1-2分钟的间隔刚好触发PDFJS默认的Worker闲置自动销毁机制，alpha版本未适配重启逻辑，可在组件初始化时禁用该规则，同时延后赋值PDF地址确保组件挂载完成后再启动渲染：

  ngOnInit(): void {
    (window as any).pdfWorkerOptions = {
      workerIdleTime: 0
    };
    setTimeout(() => {
      this.pdfSrc = '你的PDF资源地址';
    }, 0);
  }
  

• 升级到稳定版依赖
  你当前使用的是alpha测试版本，存在大量路由场景适配bug，执行命令npm i ngx-extended-pdf-viewer@^10.0.0安装10.x正式版即可修复大部分已知兼容问题。
• 路由复用场景额外适配
  如果你的项目开启了路由复用策略缓存组件实例，需要监听路由跳转事件，每次进入PDF页面时手动触发重加载：

  import { NavigationEnd, Router } from '@angular/router';
  import { filter } from 'rxjs';
  
  constructor(private router: Router, private pdfService: NgxExtendedPdfViewerService) {
    this.router.events.pipe(
      filter(event => event instanceof NavigationEnd),
      filter(event => event.url.includes('你的PDF页面路由路径'))
    ).subscribe(() => {
      this.pdfService?.reload();
    })
  }
  

故障效果截图：

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