如何在 Angular App 中保存用户活动？

问题描述

我想获取并保存用户与 angular 应用的交互， 以及与 API 的应用交互将此日志添加到文件中。

解决方法

如果我正确理解了您的问题，您可以在一个地方编写用户页面导航和 API 调用的通用逻辑。

对于页面导航，订阅路由器事件。例如

constructor(router:Router) {
  router.events.subscribe(event => {
    if(event instanceof NavigationStart) {
    }
    if(event instanceof NavigationEnd) {
      // log record to file here --> 'user navigated to XYZ page.'
    }
    // NavigationCancel
    // NavigationError
    // RoutesRecognized
  }
});

对于 API 调用，您可以实现 HTTP 拦截器。

@NgModule({
  ...
  providers: [{
    provide: HTTP_INTERCEPTORS,useClass: TokenInterceptorService,multi: true
  }]
})
export class AppModule { }

@Injectable()
export class MyInterceptor implements HttpInterceptor {
  intercept( req: HttpRequest<any>,next: HttpHandler): Observable<HttpEvent<any>> {
    // log record to file --> 'calling api {url}'
    return next.handle(req);
  }
}