반응형

🚀

예전에 개인 프로젝트를 진행하면서 웹서버를 크롤링할 때 request 모듈로 response를 요청하고
response의 body 부분을 parsing 하여 배열에 담아 해당 데이터를 활용해야 하는 경우가 많았습니다.

그러나 requset후 배열에 담아 사용하려고 해도 response 값이 제대로 나오지 않았고,
promise나 async/await에 대해 자세히 배우지 않아 몇 달간 끙끙 앓았던 문제였습니다. 

 

📋 실패한 코드

let request = require("request");

// API url
let url = "http://info.cern.ch/";

function main() {
  let res = request(url, function (error, response) {
    if (!error && response.statusCode == 200) {
      //console.log(response.body);
    }
  });
  console.log(res.body);
}

main();

단순히 코드만 놓고 봤을 때 'http://info.cern.ch/' 에 request를 보내서 response 데이터를 res라는 변수에 담고
해당 res의 body부분을 출력하는 코드입니다.

하지만 요청을 보내고 변수 res에 데이터가 아직 할당이 되지 않은 상태에서
console.log를 해서 'undefined'라는 값이 나오게 되었습니다.

 

 

📋 Promise를 then()으로 받은 코드

let request = require("request");

// API url
let url = "http://info.cern.ch/";

function doRequest(url) {
  return new Promise(function (resolve, reject) {
    request(url, function (error, response) {
      if (!error && response.statusCode == 200) {
        resolve(response);
      } else {
        reject(error);
      }
    });
  });
}
async function main() {
  doRequest(url).then(function (res) {
    console.log(res.body);
  });
}

main();

리턴 받은 promise를 then속 콜백 함수에게 인자로 전달하여 res.body를 출력합니다.

 

📋 Promise와 async/await을 사용한 코드

let request = require("request");

// API url
let url = "http://info.cern.ch/";

function doRequest(url) {
  return new Promise(function (resolve, reject) {
    request(url, function (error, response) {
      if (!error && response.statusCode == 200) {
        resolve(response);
      } else {
        reject(error);
      }
    });
  });
}
async function main() {
  let res = await doRequest(url);
  console.log(res.body);
}

main();

async 함수 : 해당 함수의 작업을 백그라운드에 넘기고 다음 작업을 수행시키는 함수
await 예약어 : 말 그대로 어떠한 작업을 기다린다는 말

await 예약어는 async 함수 안에서만 사용이 가능합니다.
doRequest(url)로 리턴 받는 response를 await 예약어를 걸어 res라는 변수에 저장하도록 하였고,
그 아랫줄에 console.log(res.body)가 실행되는데 res변수에 await이 걸려있기 때문에 
res 변수에 값이 저장되고 나서야 console.log로 res.body를 출력하게 됩니다.

 

반응형

+ Recent posts