AXIOS

babypig·2022년 9월 2일

axios http node.js

Node.js

목록 보기

8/12

AXIOS

Axios는 브라우저, Node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리다.

기능

브라우저 환경: XMLHttpRequests 요청 생성
Node.js 환경: http 요청 생성
*Promise API 지원
- Promise 객체는 비동기 작업이 맞이할 미래의 완료 또는 실패와 그 결과 값을 나타냄
JSON 데이터 자동 변환
요청/응답 데이터 변환
요청/응답 차단(Intercept)
취소 요청
사이트 간 요청 위조(XSRF) 보호를 위한 클라이언트 사이드 지원
- 웹사이트 취약점 공격의 하나로, 사용자가 자신의 의지와는 무관하게 공격자가 의도한 행위(수정, 삭제, 등록 등)를 특정 웹사이트에 요청하게 하는 공격

설치

NPM 설치

npm install axios

CDN 설치

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

사용법

문법구성

url 속성만 필수이고, 나머지 속성은 옵션이다.

axios({
method: 'get',  // `method`는 요청을 할 때 사용될 메소드 이름입니다.
url: '/user/12345',   // `url`은 요청에 사용될 서버 URL입니다.
data: { // `data`는 요청 본문(request body)으로 전송할 데이터입니다.
	   // 'PUT', 'POST' 및 'PATCH' 요청 메소드에만 적용 가능합니다.
 firstName: 'Fred',
 lastName: 'Flintstone'
}
});

//예시

//callback

axios.get('/details')
.then(function (response) {
 // 성공했을 때
 console.log(response);
})
.catch(function (error) {
 // 에러가 났을 때
 console.log(error);
})
.finally(function () {
 // 항상 실행되는 함수
});


// async await 함수를 사용할 때, 

try {
	const data = await axios.get("url");
} catch {
	// 오류 발생시 실행되는 함수
}

📒 Callback 함수 = 간단히 말하면, 함수 안에서 실행하는 또 다른 함수(나중에 자세히 알아보자)
📒 async await 함수 = async 와 같이 await가 쓰이는데 메서드 앞에 async 를 사용하고 내부에 await를 사용해 비동기 통신 요청을 처리함, 이때는 try, catch 구문 활용 (이것도 나중에 포스팅 하겠다😎)

단축메소드

//대표적인 메소드
axios.get(url[, config])            // GET
axios.post(url[, data[, config]])   // POST
axios.put(url[, data[, config]])    // PUT
axios.delete(url[, config])         // DELETE

// 그외 사용가능한 메소드
axios.patch(url[, data[, config]])  //PATCH
axios.request(config)               //REQUEST
axios.head(url[, config])           //HEAD
axios.options(url[, config])        //OPTIONS
axios.getUri([config])              //GETURI