Обещай всем с Axios

Question

Я только что прочитал статью, связанную с обещанием, и не смог понять, как мы можем сделать множественный вызов API с помощью Axios через Promise.all

Итак, рассмотрим 3 URL, давайте позвонимэто что-то вроде этого

let URL1 = "https://www.something.com"
let URL2 = "https://www.something1.com
let URL3 = "https://www.something2.com"

И массив, в котором мы будем хранить значение

  let promiseArray = []

Теперь я хочу запустить это параллельно (Promise.all), но я не могучтобы понять, как мы это сделаем?Потому что у axios есть обещание само по себе (или, по крайней мере, так я его использовал).

axios.get(URL).then((response) => {
}).catch((error) => {
})

Вопрос: Может кто-нибудь сказать, как мы можем отправить несколько запросов, используяОбещание. Все и Axios

Answer 1

Просто для добавления к утвержденному ответу axios также имеет значение Promise.all в форме axios.all, оно ожидает список обещаний и возвращает массив ответов.

let randomPromise = Promise.resolve(200);
axios.all([
    axios.get('http://some_url'),
    axios.get('http://another_url'),
    randomPromise
  ])
  .then((responses)=>{
    console.log(responses)
  })

Answer 2

Метод axios.get() возвращает обещание.

Для Promise.all() требуется массив обещаний.Например:

Promise.all([promise1, promise2, promise3])

Ну тогда ...

let URL1 = "https://www.something.com"
let URL2 = "https://www.something1.com"
let URL3 = "https://www.something2.com"

const promise1 = axios.get(URL1);
const promise2 = axios.get(URL2);
const promise3 = axios.get(URL3);

Promise.all([promise1, promise2, promise3]).then(function(values) {
  console.log(values);
});

Вы можете задаться вопросом, как выглядит значение ответа Promise.all().Что ж, тогда вы можете легко понять это сами, взглянув на следующий пример:

var promise1 = Promise.resolve(3);
var promise2 = 42;
var promise3 = new Promise(function(resolve, reject) {
  setTimeout(resolve, 100, 'foo');
});

Promise.all([promise1, promise2, promise3]).then(function(values) {
  console.log(values);
});
// expected output: Array [3, 42, "foo"]

Для получения дополнительной информации: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all

Answer 3

Вы все еще можете использовать promise.all с массивом обещаний, переданных ему, и затем ждать, пока все они будут решены или одно из них будет отклонено.

let URL1 = "https://www.something.com";
let URL2 = "https://www.something1.com";
let URL3 = "https://www.something2.com";


const fetchURL = (url) => axios.get(url);

const promiseArray = [URL1, URL2, URL3].map(fetchURL);

Promise.all(promiseArray)
.then((data) => {
  data[0]; // first promise resolved 
  data[1];// second promise resolved 
})
.catch((err) => {
});

Answer 4

fetchData(URL) функция делает сетевой запрос и возвращает объект обещания с ожидающим статусом.

networkRequestPromises содержит массив ожидающих обещаний, которые были возвращены функцией getData.

Promise.all будет ожидать разрешения всех обещаний или отклонения любого обещания,Он возвращает обещание и решает с массивом ответов.

let URLs= ["https://jsonplaceholder.typicode.com/posts/1", "https://jsonplaceholder.typicode.com/posts/2", "https://jsonplaceholder.typicode.com/posts/3"]

async function getAllData(URLs){
  let networkRequestPromises = URLs.map(fetchData);
  return await Promise.all(networkRequestPromises);
}

function fetchData(URL) {
  return axios
    .get(URL)
    .then(function(response) {
      return {
        success: true,
        data: response.data
      };
    })
    .catch(function(error) {
      return { success: false };
    });
}

getAllData(URLs).then(resp=>{console.log(resp)}).catch(e=>{console.log(e)})

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

Answer 5

Примерно так должно работать:

const axios = require('axios');
function makeRequestsFromArray(arr) {
    let index = 0;
    function request() {
        return axios.get('http://localhost:3000/api/' + index).then(() => {
            index++;
            if (index >= arr.length) {
                return 'done'
            }
            return request();
        });

    }
    return request();
}

makeRequestsFromArray([0, 1, 2]);