1

Есть у меня подобная конструкция. Не понимаю, как сделать так, чтобы после получения информации со второго fetch можно было бы использовать как и data1, так и data2 между собой. Например, вложить одно в другое. Потому что если отконсолить data1 во втором fetch, то он её не видит

function getData() {
    fetch(api1, {method: 'get'})
        .then(response => response.json())
        .then(function (data1) {
            return fetch(api2, {method: 'get'})
        })
        .then(response => response.json())
        .then(function (data2) {
            console.log(data1);
        })
        .catch(error => console.log('Причина ошибки: ' + error));
}

getData();

3 ответа 3

1

Если оба запроса независимы друг от друга и нужно получить данные из обоих, плюс ко всему fetch возвращает promise, то я бы использовал в данном случае метод Promise.all. Пример кода:

function getData() {
  var getDataFirst = fetch(api1, {method: 'get'})
    .then(response => response.json());

  var getDataSecond = fetch(api2, {method: 'get'})
    .then(response => response.json());

  Promise.all([getDataFirst, getDataSecond])
    .then(
      values => { 
        console.log(values);
      },
      reason => {
        console.log(reason);
      }
    );
}

Promise.all ждет выполнения всех обещаний (или первого метода reject). В результате также возвращает Promise, который будет выполнен когда будут выполнены все обещания, и в values - будут лежать все Ваши результаты в виде массива из двух значений.

0

Проблема в том, что Вы два последних then читаете с первого fetch Попробуйте сделать так:

function getData() {
    fetch(api1, {method: 'get'})
        .then(response => response.json())
        .then(function (data1) {
            fetch(api2, {method: 'get'})
              .then(response => response.json())
              .then(function (data2) {
                  console.log(data1);
              })
              .catch(error => console.log('Причина ошибки: ' + error));
        })
        .catch(error => console.log('Причина ошибки: ' + error));
}

getData();

0

Действительно, с then'ами легко запутаться, поэтому и придумали async/await:

async function getData() {
    try {
        let response = await fetch(api1, {method: 'get'});
        const data1 = await response.json();
        response = await fetch(api2, {method: 'get'});
        const data2 = await response.json();
        console.log(data1, data2);
    } catch(error) {
        console.log('Причина ошибки: ' + error));
    } 
}

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.