React js中的openweathermap的api密钥

Question

我已经在React中使用openweathermap（免费帐户）的API编写了天气应用。我已经像这样在componentDidMount中使用了获取。

async componentDidMount()
  {
    const url1 = "https://api.openweathermap.org/data/2.5/weather?units=metric&q=Hanoi,VN&appid=" + api_key;
    const today = await GetData(url1);
    const url2 = "https://api.openweathermap.org/data/2.5/forecast?units=metric&q=Hanoi,VN&appid=" + api_key;
    const forecast = await GetData(url2);
    this.setState({
      data: today,
      forecast: forecast
    });

考虑到我的API密钥已被阻止，原因是在一分钟内对60多个请求使用了它。因此，我有一个问题，如果有人在我的网页上重新加载了垃圾邮件，

1. 每次重新加载都会调用componentDidMount吗？
2. 如何防止这种情况？

Answer 1

每次重新加载页面时都会调用

componentDidMount。

请在官方文档https://reactjs.org/docs/react-component.html#the-component-lifecycle中详细了解组件生命周期方法。我认为您无法阻止componentDidMount在页面重新加载时被调用。因为这就是它的工作方式。

但是，您可以从服务器调用openweatherapp，并使用基于IP的限制来防止对服务器的DoS攻击。