[javascript] Axios와 함께 사용할 수 있는 요청 설정 옵션

Axios는 웹 브라우저와 Node.js에서 모두 사용할 수 있는 강력한 HTTP 클라이언트 라이브러리입니다. 이 라이브러리를 사용하면 쉽게 HTTP 요청을 보낼 수 있으며, 요청을 보낼 때 사용할 수 있는 다양한 설정 옵션을 제공합니다. 이번 글에서는 Axios의 주요 요청 설정 옵션에 대해 알아보겠습니다.

1. timeout

timeout 옵션은 HTTP 요청에 대한 응답을 기다리는 최대 시간을 설정하는 옵션입니다. 기본값은 0이며, 0은 타임아웃이 없음을 의미합니다. 만약 응답이 일정 시간 내에 도착하지 않으면 요청이 실패하게 됩니다.

axios.get('/api/data', {
  timeout: 5000 // 5초까지 응답을 기다림
})

2. headers

headers 옵션은 HTTP 요청에 추가할 헤더를 지정하는 옵션입니다. 헤더는 요청에 대한 부가적인 정보를 담고 있으며, 예를 들어 Content-Type이나 Authorization 등이 있습니다.

axios.post('/api/login', {
  username: 'myusername',
  password: 'mypassword'
}, {
  headers: {
    'Content-Type': 'application/json'
  }
})

3. params

params 옵션은 GET 요청 시 쿼리 파라미터를 지정하는 옵션입니다. 쿼리 파라미터는 URL 뒤에 ?를 붙이고 key=value 형태로 추가할 수 있습니다.

axios.get('/api/search', {
  params: {
    query: 'keyword',
    page: 1
  }
})

4. data

data 옵션은 POST 요청 시 보낼 데이터를 지정하는 옵션입니다. 데이터는 JSON 형태로 전송됩니다.

axios.post('/api/data', {
  name: 'John',
  age: 30
})

5. auth

auth 옵션은 HTTP 요청에 인증 정보를 추가하는 옵션입니다. Basic 인증을 사용할 경우 아래와 같이 사용할 수 있습니다.

axios.get('/api/data', {
  auth: {
    username: 'myusername',
    password: 'mypassword'
  }
})

위에서 소개한 옵션 외에도 baseURL, responseType, withCredentials, maxRedirects 등 다양한 설정 옵션을 사용할 수 있습니다. Axios의 공식 문서에서 자세한 내용을 확인할 수 있습니다.

공식 문서