[fetch] Can I use fetch in fetch?

JJeong·2021년 4월 29일
0
var url = 'https://api.spacexdata.com/v2/launches/latest';

var result = fetch(url, {
    method: 'get',
  }).then(function(response) {
    return response.json(); // pass the data as promise to next then block
  }).then(function(data) {
    var rocketId = data.rocket.rocket_id;

    console.log(rocketId, '\n');

    return fetch('https://api.spacexdata.com/v2/rockets/' + rocketId); // make a 2nd request and return a promise
  })
  .then(function(response) {
    return response.json();
  })
  .catch(function(error) {
    console.log('Request failed', error)
  })

// I'm using the result variable to show that you can continue to extend the chain from the returned promise
result.then(function(r) {
  console.log(r); // 2nd request result
});

fetch를 이렇게 중첩해서 사용하는 게 가능하다. (chain multiple promises) 눈여겨볼 부분은 return에 함수를 실행시켰다는 점이다. 결국 해당 함수의 return 값이 최종 return 값이 되고 동시에 .then, .catch의 인자값이 된다. return으로 값을 받고 .then 안에서 해당 값을 이용하는 fetch를 실행시켜도 되지만, 어차피 에러가 나면 .catch로 빠지기 때문에 return에서 바로 호출하는 편이 더 간결한 것 같다.

0개의 댓글