티스토리 뷰

Javascript

Axios

lluna 2021. 11. 10. 17:37

Axios

"Promise based HTTP client for the browser and Node.js"

 

"브라우저를 위한 Promise 기반의 클라이언트"

자바스크립트 내에 cdn을 삽입하면, XHR이라는 브라우저 내장 객체 대신 AJAX 요청을 처리할 수 있다.

즉, AJAX (비동기 처리) 요청을 Axios 클라이언트 라이브러리로 사용하는 것!

XMLHttpRequest 를 Axios로 대체하는데, 비동기처리 하면서 순차적 연쇄를 보장한다.

 

Vue.js 에서도 사용한다.

 

 

GitHub - axios/axios: Promise based HTTP client for the browser and node.js

Promise based HTTP client for the browser and node.js - GitHub - axios/axios: Promise based HTTP client for the browser and node.js

github.com

 

CDN

<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>

 

 

GET요청 예시

// Make a request for a user with a given ID
axios.get('/user?ID=12345')
  .then(function (response) {
    // handle success
    console.log(response);
  })
  .catch(function (error) {
    // handle error
    console.log(error);
  })
  .then(function () {
    // always executed
  });

POST요청 예시

axios.post('/user', {
    firstName: 'Fred',
    lastName: 'Flintstone'
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

 

axios API

// Send a POST request
axios({
  method: 'post',
  url: '/user/12345',
  data: {
    firstName: 'Fred',
    lastName: 'Flintstone'
  }
});
// GET request for remote image in node.js
axios({
  method: 'get',
  url: 'http://bit.ly/2mTM3nY',
  responseType: 'stream'
})
  .then(function (response) {
    response.data.pipe(fs.createWriteStream('ada_lovelace.jpg'))
  });

'Javascript' 카테고리의 다른 글

AJAX  (0) 2021.11.08
간단한 Todo 구현하기  (0) 2021.11.08
event.preventDefault()  (0) 2021.11.07
DOM - Collection (Live vs. Static)  (0) 2021.11.07
for loop vs. forEach()  (0) 2021.11.07
댓글