Search

axios

axios

axios는 JavaScript의 HTTP 클라이언트 라이브러리로, 브라우저와 Node.js 환경에서 모두 사용할 수 있습니다. axios는 Promise를 기반으로 한 강력한 기능과 다양한 설정 옵션을 제공하여 네트워크 요청을 보다 편리하게 다룰 수 있도록 도와줍니다.

Axios 기본 구조

// 기본적인 GET 요청 axios.get('https://jsonplaceholder.typicode.com/todos/1') .then(response => { // 성공적인 응답 처리 console.log(response.data); }) .catch(error => { // 오류 처리 console.error('Request failed:', error); });
JavaScript
복사

Axios의 주요 메서드

Axios 설정 객체(config)의 주요 속성

url: 요청을 보낼 URL
method: HTTP 메서드 (GET, POST, PUT, DELETE 등)
params: URL에 추가할 쿼리 매개변수
data: 요청 바디에 포함될 데이터 (POST, PUT 등에서 사용)
headers: 요청 헤더 설정
timeout: 요청이 얼마나 길어질 수 있는지 설정

Axios의 반환값

axios 메서드는 Promise를 반환합니다. 이 Promise는 성공적인 응답일 경우 response 객체를 resolve하고, 오류가 발생한 경우 error 객체를 reject합니다.

모듈이 설치되어 있어야한다.

npm install axios
JavaScript
복사

예시 코드 - get

// axios 라이브러리 가져오기 const axios = require('axios'); // GET 요청 보내기 axios.get('https://httpbin.org/get') .then(response => { // 성공적인 응답 처리 console.log(response.data); }) .catch(error => { // 오류 처리 console.error('Request failed:', error); });
JavaScript
복사

예시 코드 - post

const axios = require('axios') const url = 'https://httpbin.org/post' const data = { name : '김조은', age : 25 } const headers = { 'ContentType' : 'application/json' } // axios POST 요청 axios.post(url, data, headers) .then(response => { console.log(`data : ${response.data}`); // ⭐ console.dir(객체) // : 객체를 펼쳐서 로그를 출력해준다. console.dir(response.data); }) .catch(error => { console.log(`error : ${error}`); })
JavaScript
복사