在ReactJS中安排API调用

Question

我有一个基于反应的Web应用程序，它从Jenkins API检索数据。在componentDidMount（）函数期间，我调用了第一个启动API调用流程的API。然后，我将使用API​​中的数据渲染组件。

Jenkins服务器每天早上7点开始构建每个项目。因此，我想在每天晚上8点左右从React调用这些API。

我们是否可以安排React调用这些API，并在一天的特定时间内获取前面提到的更新数据？或刷新浏览器等导致新的API数据？我是React的新手，所以感谢您提出的建议。

Answer 1

您在componentDidMount()内正确使用了API调用。您可以在装载时使用setTimeout()等待到20:00，然后每隔24小时再次使用setInterval()触发该事件。

所以喜欢：

componentDidMount() {
  const currentTime = new Date().getTime();  //current unix timestamp
  const execTime = new Date().setHours(20,0,0,0);  //API call time = today at 20:00
  let timeLeft;
  if(currentTime < execTime) {
    //it's currently earlier than 20:00
    timeLeft = execTime - currTime;
  } else {
    //it's currently later than 20:00, schedule for tomorrow at 20:00
    timeLeft = execTime + 86400000 - currentTime
  }
  setTimeout(function() {
    setInterval(function() {

      //your code

    }, 86400000);  //repeat every 24h
  }, timeLeft);  //wait until 20:00 as calculated above
}

换句话说，它会：

1. 计算现在和下一个20:00点之间的时差。
2. 等到20:00 setTimeout()。
3. 将触发器设置为正好24小时（即86400000 ms ）以重复setInterval()内的代码。

无论您何时启动React应用程序，这都会有效。