유치원 api 정보를 불러오기 위해 rest api 형태로 url과 해당하는 파라미터 값을 보내줬는데 postman에서는 json 형태로 잘 떨어졌는데 내 api 서버에는 오류메세지가 html 형식으로 떨어졌다.
postman 으로 보내준 3개의 필수 파라미터, api key, sidoCode(시), sggCode(시,군,구) 형태
postman의 결과 값
해당 코드(method는 실제로 POST다, 사진에서만 GET 방식)
api 오류 메세지
postman은 잘나오는데 api 서버에서 자꾸 저렇게 나오니까 미칠노릇이었따.ㅜㅜ
명확한 메세지가 없이 저런 식으로 넘어와서 이틀정도 이것저것 해보면서 고생했지만,, 결국 수석님께 여쭤봐서 해결했다.
수석님은 1시간 정도 고민하시다가 해결해주셨는데 Axios란 라이브러리를 쓰라고 하셨다.
- Axios는 브라우저, Node.js를 위한 PromisAPI를 활용하는 HTTP 비동기 통신 라이브러이이다.
- HTTP 요청 취소 및 요청과 응답을 JSON 형태로 자동으로 변경해주고, 브라우저 호환성이 뛰어나다
- 기본형태 : GET, POST, other Http Method
내가 생각하기에 request 라이브러리는 get 방식에서는 깔끔하게 호환이 되지만 post 방식으로는 잘 호환이 되지 않는다.(개인적인 생각)
Axios는 브라우저와 호환이 뛰어나기에 해결이 가능한거일 수도,,,
설치 방법
$ npm install axios
설치가 완료시
Axiois 문법 구성
axios({
url: 'https://test/api/cafe/list/today', // 통신할 웹문서
method: 'get', // 통신할 방식
data: { // 인자로 보낼 데이터
foo: 'diary'
}
});
Axiois 응답(response) 데이터
axios를 통해 요청을 서버에게 보내면, 서버에서 처리를하고 다시 데이터를 클라이언트에 응답 하게 된다.
이를 .then으로 함수인자로(response)로 받아 객체에 담진 데이터가 바로 응답 데이터이다.
ajax를 통해 서버로부터 받는 응답의 정보는 다음과 같다.
const config = {
method: 'post',
url: uri,
}
axios(config).then(function (response) {
const result = response.data;
console.log(result);}).catch(function (error) {
console.log(error);
});
해당 데이터를 받으면, 데이터를 잘 가공해서 사용해주면 된다
