Node.js 跟踪特定react组件的使用统计信息

我想集成一个功能，让我能够跟踪用户在特定react组件（基本上是网站的一部分）中花费的时间。该网站是用react+nodejs+mysql构建的。我能想到的唯一解决方案是，为一个人在组件中花费的每分钟发送一个post请求（通过在加载组件时每隔一段时间运行一个函数）

有没有更好的方法来实现这一点，即每分钟不涉及1000个请求？我不想全面跟踪统计数据，只想跟踪特定组件中的统计数据

---

谢谢。

您可以使用react生命周期方法启动计时器，然后在卸载时发送帖子

我还没有测试过这样的代码

class Clock extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
                  start: new Date(),
                  end: new Date()};
  }

  componentDidMount() {
    this.timerID = setInterval(
      () => this.tick(),
      1000
    );
  }

  componentWillUnmount() {
    postTimeToApi(this.state.start, this.state.end);
    clearInterval(this.timerID);
  }

  tick() {
    this.setState({
      end: new Date()
    });
  }

  render() {
    return (
      <div>
        <h1>Hello, world!</h1>
        <h2>It is {this.state.end.toLocaleTimeString()}.</h2>
      </div>
    );
  }
}

类时钟扩展React.Component{
建造师（道具）{
超级（道具）；
此.state={
开始：新日期（），
结束：新日期（）；
}
componentDidMount（）{
this.timerID=setInterval(
（）=>这个。勾选（），
1000
);
}
组件将卸载（）{
postTimeToApi（this.state.start、this.state.end）；
clearInterval（this.timerID）；
}
勾选（）{
这是我的国家({
完:新日期()
});
}
render（）{
返回(
你好，世界！
它是{this.state.end.toLocaleTimeString（）}。
);
}
}

或许

class Clock extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
                  start: new Date()};
  }

  componentWillUnmount() {
    const end = new Date();
    postTimeToApi(this.state.start, end);
   }

  render() {
    return (
      <div>
        <h1>Hello, world!</h1>
        <h2>It is {this.state.start.toLocaleTimeString()}.</h2>
      </div>
    );
  }
}

类时钟扩展React.Component{
建造师（道具）{
超级（道具）；
此.state={
开始：新日期（）；
}
组件将卸载（）{
const end=新日期（）；
postTimeToApi（this.state.start，end）；
}
render（）{
返回(
你好，世界！
它是{this.state.start.toLocaleTimeString（）}。
);
}
}

您真的想在组件级别进行跟踪吗？或者您是指页面级别？您能否提供更多关于“在组件中花费”的详细信息，并描述用户在组件中考虑时执行的操作？在组件装载时获取时间参考，并在组件中发送POST请求WillUnmount？Celso，是的，这是一个非常好的建议，可能是我将寻求的解决方案。谢谢