Все запросы возвращаются по одному, а не одновременно

Question

Не могли бы вы помочь мне с моим кодом. Мне нужно выполнять запросы одновременно, но получать запросы один за другим. Пример кода ниже (используйте метод / функцию VueJS)

async manageData() {
   // array of chart's properties
   const charts = await axios.post('/report/chart_data', {id: this.id);
   // concurrent requests with variable 'charts'
   const result = await Promise.all(
      charts.map((chart, key) => axios.post('/report/data_range', {id: key}))
   );
}

Answer 1

   const charts = await axios.post('/report/chart_data', {id: this.id);

Сделает один запрос и дождется его завершения, прежде чем продолжить.Это необходимо, поскольку вы затем используете ответ charts для формирования ваших последующих запросов.

      charts.map((chart, key) => axios.post('/report/data_range', {id: key}))

Выполнит charts.length количество запросов параллельно.Это желательно для вашего описания и потому что кажется, что запросы независимы.

Ваш скриншот поддерживает этот анализ (первый запрос ожидает ответа, прежде чем последующие запросы будут выполнены параллельно).

Есливы знаете длину ответа charts, вы можете распараллелить первый и последующие запросы, поскольку вы используете только key (индекс), а не фактические chart s для выполнения последних запросов.

Если вы обеспокоены тем, почему ваши последние запросы, по-видимому, требуют все больше времени для ответа, это может быть просто совпадением сложности каждого запроса или, как указал пользователь ctt @ в комментариях, может указывать на то, что ваш бэкэнд не обрабатывает запросы.одновременно.Но это, похоже, не ваша забота (согласно вашему комментарию).