react webapp中审计和时间记录用户行为的最佳解决方案？答案

【问题标题】：Best solution to audit and time log user behavior in react webapp?react webapp中审计和时间记录用户行为的最佳解决方案？
【发布时间】：2018-12-11 14:35:14
【问题描述】：

有哪些可用的库/工具可用于监控 react webapp 中的用户行为？

我正在使用一个高级网络系统，并且已经到了收集有关网络应用特定部分的用户行为数据的地步。示例我想跟踪每个用户在第一次访问个人资料时花费了多少时间。我还想将其记录在我的数据库中，以便我可以进行统计并比较以前的统计数据。

工具必须：

在 React 应用中工作。
能够跟踪从组件可见到不可见的时间。
跟踪在单个页面上花费的时间。
做一个独立的独立工具，没有第三方云爵士乐。

我不是在寻找：

谷歌分析。
显示用户点击位置的工具
请求用户反馈的工具
cookie 工具

【问题讨论】：

标签： reactjs logging analytics tracking

【解决方案1】：

大约两年后，我们发现了这个库 https://www.npmjs.com/package/timeme，它几乎完全满足了描述的需求。

我们像这样在反应中使用它：

const TimeMe = require('timeme.js');

getInitialState () {
  return {
    entryTime: new Date()
  };
},

componentDidMount () {
  window.addEventListener('beforeunload', this.loggingInteraction);
  TimeMe.startTimer(pageId);
},

async loggingInteraction () {
  TimeMe.stopTimer(pageId);
  const activeTimeOnPage = TimeMe.getTimeOnPageInSeconds(pageId) * 1000;
  TimeMe.resetRecordedPageTime(pageId);
  const totalTimeOnPage = T.millisecondsBetween(this.state.entryTime, T.now());
  // http send time on page request
},

【讨论】：