Axios
Promise 기반 HTTP 클라이언트 라이브러리로, 브라우저와 Node.js 모두에서 사용할 수 있음.
Axios는 간편한 API를 제공하므로, HTTP 요청 및 응답 데이터를 쉽게 처리할 수 있음
Axios는 자주 사용되는 HTTP 메소드( GET, POST, PUT, DELETE 등)를 지원,
요청 시 설정할 수 있는 다양한 옵션과 함께 요청을 보낼 수 있음
Axios는 기본적으로 Promise를 반환하며, then()을 사용하여 비동기 요청을 처리할 수 있음.
또한, async/await 패턴을 사용하여 응답 데이터를 동기적으로 처리할 수 있습니다.
Axios는 예외 처리와 요청 취소 등의 기능도 제공합니다.
또한, 인터셉터를 사용하여 요청 및 응답 데이터를 중간에 가로채 서드파티 라이브러리와 통합가능
Axios는 다양한 환경(브라우저, 웹 앱, 서버 등)에서 사용할 수 있으며,
간단하고 직관적인 API를 제공.
fetch와의 차이점
Axios와 Fetch는 모두 브라우저에서 네트워크 요청할 때 사용.
API의 직관적 이해도: Axios는 API가 더 직관적
request-config와 response-config를 모두 다룰 수 있게 함
Fetch API는 이와 달리 상위 수준의 interface를 제공하지 않고 Http response 객체만 반환
단축 구문: Axios는 HTTP 요청을 보낼때 GET, POST, PUT, DELETE 같은
다양한 메소드를 작성하는데 용이한 에일리어스(alias)를 제공하지만
Fetch API는 POST에서 양식 데이터를 처리하는 경우 body 속성을 직접 지정
Request/Response Interceptor Support: Axios는 request와 response의 네트워크 인터셉터 지원을 제공합니다.
Fetch API는 이와 같은 인터셉터를 제공하지 않음
브라우저 vs Node.js 지원: Axios는 브라우저 및 Node.js에서 모두 지원함
Fetch API는 브라우저에 탑재
Node.js에서는 비공식적으로 사용할 수 있지만 추가 모듈 설치 필요
배포 크기: Axios는 구형 브라우저 및 Node에서 사용하는 디펜던시에 따라 대략적으로 67KB 정도의 용량임
Fetch API는 대략적으로 10KB 정도의 용량이며, 별도의 디펜던시 없이 사용 가능
결론적으로 Axios는 API 사용성과 인터셉터 지원으로 인해 많이 사용
'WebDev > 항해99' 카테고리의 다른 글
2023 7.24 클론 코딩 프로그래스 바 (0) | 2023.07.25 |
---|---|
웹미니 프로젝트 회고 (0) | 2023.07.23 |
FE, BE 웹 미니 프로젝트 SA 작성 (0) | 2023.07.14 |
리액트쿼리, 리덕스 (0) | 2023.07.11 |
라이프사이클, react hooks (0) | 2023.07.09 |