레이블이 async인 게시물을 표시합니다. 모든 게시물 표시
레이블이 async인 게시물을 표시합니다. 모든 게시물 표시

javascript async, await 로 axios 순차 수행하기

// promise 는 비동기 처리가 완료된후 결과를 주겠다는 약속이다.
// promise 를 리턴하고 ms 만큼 지연하는 함수
delay(ms) {
  // promise 는 pending(진행중), fulfilled(수행완료/성공), rejected(수행실패) 상태가 있다.
  // 비동기처리를 되고 있음을 가정하기 위해 setTimeout 사용
  // 1초 후
  // success 함수를 호출하며 fulfilled 상태가 되고
  // fail 함수를 호출하면 rejected 상태가 된다.
  return new Promise(function(success, fail) {
    setTimeout(() => {
      success();
    }, ms);
  });
}

// async 를 붙이면 비동기 함수로 정의되며 promise 를 리턴받을 수 있다.
async function gogo(items) {
  for (const v of items) {
    // await 는 async 함수내에서만 사용할 수 있다.
    // await 은 promise 리턴하는 함수에서만 사용할 수 있다.
    // await 이 붙인 함수가 종료될때까지 기다린다.
    // async 함수내에서 await 로 axios 요청
    await axios
      .post("/api/query", v, {
        headers: {
          "Content-Type": "application/json",
        },
      })
      .then(() => {
        console.log("요청 성공");
      })
      .catch((err) => {
        console.log("요청 실패");
      });
    // 전송 후 1초 대기
    await this.delay(1000);
  }
}