使用 setTimeout 和 map 来避免 API 速率限制的问题答案

【问题标题】：Issues using setTimeout with map to avoid API rate limiting使用 setTimeout 和 map 来避免 API 速率限制的问题
【发布时间】：2018-11-06 21:45:50
【问题描述】：

我正在使用 Spotify 的 Web API 开展一个项目，但在达到速率限制时遇到了一些麻烦。

我有一个包含大约 500 位艺术家的数组，我想循环访问该数组以使用 axios 从 Spotify 的 API 中为每位艺术家获取一张照片。为了避免速率限制，我在地图中使用了 setTimeout，因此每次调用 API 之间会有半秒的延迟。

按照我现在的设置方式，地图一次全部触发，我受到了限制。

这是我正在使用的代码。 noPhoto 是艺术家姓名的数组。谢谢！

const addArtistSpotifyPhoto = (req, res) => {
  console.log(noPhoto);
  noPhoto.map(e => {
    console.log(e);
    setTimeout(() => {
      axios
        .get(
          `https://api.spotify.com/v1/search?q=${e
            .split(' ')
            .join('%20')}&type=artist&limit=1`,
          {
            headers: { Authorization: `Bearer ${req.user.accessToken}` }
          }
        )
        .then(response => {
          console.log(e, response.data.artists.items.images);
        })
        .catch(console.log);
    }, 500);
  });
};

解决方案编辑：

对 Matti Price 的回答大喊大叫。这是他建议我修复它的方式，并且它有效：

const addArtistSpotifyPhoto = (req, res) => {
  console.log(noPhoto);
  noPhoto.map((e, i) => {
    console.log(e);
    setTimeout(() => {
      axios
        .get(
          `https://api.spotify.com/v1/search?q=${e
            .split(' ')
            .join('%20')}&type=artist&limit=1`,
          {
            headers: { Authorization: `Bearer ${req.user.accessToken}` }
          }
        )
        .then(response => {
          console.log(e, response.data.artists.items.images);
        })
        .catch(console.log);
    }, 500 * i);
  });
};

【问题讨论】：

标签： javascript axios settimeout spotify

【解决方案1】：

setTimeout 本质上是异步的，因此它不会等待函数触发然后触发下一个函数，它会非常快速地循环并创建所有回调以在 500 毫秒内触发，因此它们最终都会触发一次。

在您的地图函数中添加索引，并将延迟时间乘以索引，这样它就可以将它们每 500 毫秒交错一次。

【讨论】：