Axios 액시오스

이재원·2021년 10월 14일
0

1. 공식 가이드 사이트

2. 설치 방법

npm install axios // npm 설치 후 

<script>
import axios from 'axios'; // import 후 사용  vue 기반
</script>

3. axios.get(url[, config])

GET를 통해 해당 데이터 조회합니다. 데이터 대한 자세한 정보를 가져온다.

axios.get("https://reqres.in/api/users?page=1").then(response => {
  console.log('getlist response', response); //에러 응답
}).catch(error => {
  console.log('error', error.response); //에러 응답
});

4. axios.post(url[, data[, config]])

  • POST를 통해 해당 URI를 요청하면 전달한 데이터를 기반으로 생성
let user = {
  email: "eve.holt@reqres.in",
  password: "cityslicka"
}

axios.post("https://reqres.in/api/login", user).then(response => {
  console.log('post response', response);
}).catch((error) => {
  console.log('error', error);
  console.log('response', error.response); //에러 응답
  console.log('request', error.request);
});
  • 파일을 포함하여 전달해야 하는 경우
const bodyForm = new FormData();
bodyForm.append("filelist",file); // 파일이 여러개 이면 파일 1개당 append 함수를 호출해 주어야 함.
bodyForm.append("user",user);

axios.post('https://reqres.in/api/users', bodyForm).then(response => {
  console.log(response);
}).catch(error => {
  console.log(error.response);
})

5. axios.put(url[, data[, config]])

PUT를 통해 해당 데이터 수정합니다.

let user = {
  name: "jaewon",
  job: "developer"
}
axios.put('https://reqres.in/api/users/2', user).then(response => {
  console.log(response);
})

6. axios.delete(url[, config])

DELETE를 통해 데이터 삭제합니다.

axios.delete('https://reqres.in/api/users/2', user).then(response => {
  console.log(response);
}).catch(error => {
  console.log(error.response);
})

0개의 댓글