NodeJS의 쉬운 요청

⚠ 읽기 시작하기 전에 이것은 내 첫 번째 게시물이며 블로그 게시물에 대한 경험이 많지 않으므로 이에 대한 피드백을 보내주세요 ☄

안녕!

오늘은 async/await를 사용하여 http/https 요청을 더 쉽게 만드는 방법을 알려드리겠습니다.

비동기/대기란 무엇입니까?

async 선언이 있는 함수는 await 식을 사용할 때 "일시 중지"될 수 있습니다.

어떻게 작동하는지 보자…

Matrix(1999)에서 Trinity는 Neo에게 Folow the white rabbit라는 메시지를 보냅니다. 이제 이 예제에서 Trinity는 비동기 자바스크립트에 문제가 있습니다.

function sendMessageToNeo() {
    partOne()
    partTwo()
}
function partOne() {
    setTimeout(() => {
        console.log('follow the')
    }, 1000)
}
function partTwo() {
    setTimeout(() => {
        console.log('white rabbit')
    }, 500)
}

sendMessageToNeo()

산출

white rabbit
follow the

async/await를 사용하여 Trinity를 도울 수 있습니다.

async function sendMessageToNeo() {
    await partOne()
    await partTwo()
}
async function partOne() {
    await wait(1000)
    console.log('follow the')
}
async function partTwo() {
    await wait(500)
    console.log('white rabbit')
}

async function wait(ms = 0) {
    return new Promise(r => setTimeout(r, ms))
}

sendMessageToNeo()

산출

follow the
white rabbit

🐰🐰🐰

프로젝트를 만들어 봅시다

프로젝트 폴더에 세 개의 파일 생성

패키지.json

request.js

app.js

패키지.json

{
  "dependencies": {
    "cheerio": "^1.0.0-rc.2",
    "request": "^2.87.0"
  }
}

cheerio : html 조작에 사용됨

request : 요청하기

request.js

const request = require('request')

async function get (url) {
  return new Promise((resolve, reject) => {
    request({ url, method: 'GET' }, (error, response, body) => {
      if (error) return reject(error)

      return resolve({ body, response })
    })
  })
}

async function post (url, data) {
  return new Promise((resolve, reject) => {
    request({ url, method: 'POST', data }, (error, response, body) => {
      if (error) return reject(error)

      return resolve({ body, response })
    })
  })
}

module.exports = {
  get,
  post
}

request.js에서 요청에 대한 동기 논리를 만듭니다. async 선언 및 Promises를 참조하십시오.

app.js

const request = require('./request')
const cheerio = require('cheerio')

async function sendRequest () {
  let { response, body } = await request.get(`https://www.google.com.br/search?q=node+js`)

  if (response.statusCode !== 200) {
      return error(response, body)
  }

  success(response, body)
}

function success (response, body) {
    const $ = cheerio.load(body)

    console.log(`Status: ${response.statusCode}`)
    console.log(`Message: ${response.statusMessage}`)
    console.log(`Request: ${$('.g').length} results found!`)
}
function error (response) {
    console.log(`Status: ${response.statusCode}`)
    console.log(`Message: ${response.statusMessage}`)
}

sendRequest()

app.js에서 Google에 요청하고 성공 응답이 있는 경우 결과에서 개수를 인쇄합니다.

산출

Status: 200
Message: OK
Request: 10 results found!

차이점을 확인하십시오

비동기/대기 없이

function sendRequest() {
    request({ url: '_url', method: 'GET' }, (error, response, body) => {
      if (error) return console.log(error)

      console.log(body)
      console.log(response)
    })  
}
sendRequest()

비동기/대기로

async function sendRequest() {
    let { response, body } = await request.get(`_url`)

    console.log(body)
    console.log(response)
}
sendRequest()

결론

이 게시물에서 우리는 어떻게 async/await 코드를 더 아름답게 만드는지 볼 수 있으며 이 사람들과 함께 유명한 Callback Hell에 문제가 없습니다.

콜백 지옥

function hell() {
    functionOne('one', (err, one) => {
        console.log(one)
        functionTwo('two', (err, two) => {
            console.log(two)
            functionThree('three', (err, three) => {
                console.log(three)
                functionFour('four', (err, four) => {
                    console.log(four)
                })
            })
        })
    })
}

비동기/대기로

async function heaven() {
    let one = await functionOne('one')
    let two = await functionTwo('two')
    let three = await functionThree('three')
    let four = await functionFour('four')

    console.log(one)
    console.log(two)
    console.log(three)
    console.log(four)
}

따라서 async/await에 문제가 있거나 나에게 제안할 사항이 있으면 이 게시물에 의견을 보내주십시오.

안녕히 계세요! 곧 봐요!