axios는 뭐니

https://axios-http.com/kr/docs/intro
오 한글문서

• ✌️Promise✌️ 기반 HTTP 클라이언트
• 서버 : 네이티브 node.js의 http 모듈을 사용
• 클라이언트(브라우저) : XMLHttpRequests를 사용

url만 필수고 GET이 디폴트다
그래서 이것도 GET임
axios('/user/12345');

예제_node.js에서 GET 요청으로 원격 이미지 가져오기

axios({
  method: 'get',
  url: 'http://bit.ly/2mTM3nY',
  responseType: 'stream' //
})
  .then(function (response) {
    response.data.pipe(fs.createWriteStream('ada_lovelace.jpg'))
  });

config 전역 기본값

axios.defaults.baseURL 
	= 'https://api.example.com';

axios.defaults.headers.common['Authorization'] 
	= AUTH_TOKEN;

axios.defaults.headers.post['Content-Type'] 
	= 'application/x-www-form-urlencoded';

const instance = axios.create({
  baseURL: 'https://api.example.com'
});
instance.defaults.headers.common['Authorization'] 
	= AUTH_TOKEN;

axios config 옵션들

https://axios-http.com/kr/docs/req_config

params: { ID: 12345 },

• params는 요청과 함께 전송되는 URL 파라미터
• 반드시 일반 객체나 URLSearchParams 객체여야 함
• 참고: null이나 undefined는 URL에 렌더링되지 않음

data: { firstName: 'Fred' },

• data는 요청 바디로 전송될 데이터
• PUT, POST, PATCH, DELETE 메소드에서만 적용 가능
• 만약! transformRequest(얘도 옵션)가 설정되지 않은 경우 string, plain object, ArrayBuffer, ArrayBufferView, URLSearchParams 타입 중 하나여야함

timeout: 1000,

• 디폴트는 0 (타임아웃 없는거)
• 기다리다가 요청이 1000보다 오래 걸리면 요청중단
• 단위는 밀리초

auth: { username: 'janedoe', password: 's00pers3cret' },

• auth를 사용하면, Authorization 헤더가 설정되어 headers를 사용하여 설정한 기존의 Authorization 사용자 지정 헤더를 덮어씁니다.
• HTTP Basic 인증만 구성할 수 있음

maxContentLength: 2000,

• 허용되는 http 응답 콘텐츠의 최대 크기를 바이트 단위로 정의

validateStatus: function (status) { return status >= 200 && status < 300; // 기본값 },

• 지정된 HTTP 응답 상태 코드에 대한 Promise를 이행할지 또는 거부할지 여부를 정의
• if(validateStatus===true||null||undefined) Promise는 이행
• else Promise 거부

응답 스키마

axios.get('/user/12345')
  .then(function (response) {
    console.log(response.data);
    console.log(response.status);
    console.log(response.statusText);
    console.log(response.headers);
    console.log(response.config);
  });

• data는 데이터고
• status는 HTTP 상태코드
• statusText는 HTTP 상태메세지
• headers는 HTTP 헤더, 소문자이고 response.headers['hey'] 이런식으로 접근가능
• config는 axios가 제공하는거
• request는

에러 핸들링

axios.get('http://bit.ly/2mTM3nY', {
    params: {
      ID: 12345
    }
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    if (error.request) {
      // 요청이 전송되었지만, 응답이 수신되지 않았습니다. 
      console.log(error.request);
    } else {
      // 오류가 발생한 요청을 설정하는 동안 문제가 발생했습니다.
      console.log('Error', error.message);
    }
    console.log(error.config);
  })
  .then(function () {
    // 항상 실행되는 영역
  }); 

에러정보를 구구절절 보고싶다면 error.toJson()

axios.get('/user/12345')
  .catch(function (error) {
    console.log(error.toJSON());
  });

그리고 이 config 옵션 여기서 쓸 수 있음
validateStatus: function (status) { return status >= 200 && status < 300; // 기본값 },

axios.get('/user/12345', {
  validateStatus: function (status) {
    return status < 500; 
    // 상태 코드가 500 미만인 경우에만 해결
  }
})

아니 잠깐 생각해보니까 post를 해야 응답이 오잖아 바보인가??? https://axios-http.com/kr/docs/urlencoded 구구절절 읽어보자

그리고 이건 왜지 그냥 then 쓰면 되는거 아닌가