Angular单页应用跳转时timeonsite tracker未正确捕获页面URL与标题

这不是timeonsitetracker.js的原生bug，属于单页应用集成时的适配遗漏。
该库默认面向传统多页应用设计，仅在浏览器触发整页加载、刷新、关闭这类原生页面生命周期事件时，才会读取当前页面URL、title初始化追踪上下文。Angular作为单页应用，路由切换由前端JS控制，不会触发整页重载，库感知不到页面跳转，自然会一直保留首次初始化时读取到的首页URL和title，不会自动更新。你提到非单页应用下功能正常，也完全符合这个逻辑。

• 监听Angular路由完成事件，手动更新追踪器上下文
  Angular路由切换完成后会抛出NavigationEnd事件，在根组件监听这个事件，每次路由跳转完成后主动调用追踪器的上下文更新方法，传入最新的页面URL和标题，同时结束上一个页面的时长统计、开启新页面计时，参考实现：

  // app.component.ts
  import { Router, NavigationEnd } from '@angular/router';
  declare var Tos: any; // 对应你全局挂载的Tos实例
  
  constructor(private router: Router) {
    this.router.events.subscribe(event => {
      if (event instanceof NavigationEnd) {
        // 路由加载完成后更新追踪器的页面信息
        if (Tos?.updatePageContext) {
          Tos.updatePageContext({
            URL: window.location.href,
            title: document.title
          });
        }
      }
    });
  }
  

  如果当前使用的库版本没有updatePageContext方法，可以在路由离开钩子中调用Tos.stopTracking()结束当前页追踪并上报数据，路由进入后重新传入新配置初始化追踪实例即可，效果一致。
• 版本兼容校验
  你当前使用的是hash路由模式，建议将timeonsitetracker.js升级到1.4.0及以上稳定版本，低版本对hash格式URL的识别存在兼容问题，可能导致手动更新上下文后依然识别异常。
• 结果校验
  适配完成后切换路由，控制台打印的上报数据中URL、title字段会和当前访问页面对应，timeOnPage字段随每次路由跳转重新从0开始累计，timeOnSite字段保留整站访问的累计时长，即为正常状态。

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