axios 2

[Axios] axios interceptors 사용해보자

interceptors란 API 요청과 응답을 가로채는 것을 말한다. 사용하는 이유 API통신에서 공통적으로 전, 후처리가 필요할 때 token이 만료되었을 때를 감지하고 처리하기 위해서 에러가 발생했을 때 aleart창 띄어주기 일단 내가 사용하는 이유는 위와 같다. 위에서 언급한 것과 같이 axios를 사용할 때 interceptors를 사용하게 된다면 모든 API 통신은 interceptors를 거치기 때문에 공통적인 작업을 처리하기가 좋다. 사용법 // 요청 interceptors instance.interceptors.request.use( function (config) { // 요청하기전에 필요한 작업 return config; }, function (error) { // 요청에 오류가 있을..

[React] axios를 이용한 excel 파일(.sheet) 다운로드 기능 구현

axios를 이용해서 api통신을 한 뒤 응답받은 데이터의 확장자명이 .xlsx 였다... 엑셀파일을 다운로드하는 기능을 구현해야했다. 거의 하루가 꼬박걸려서 구글링하고 찾아보고 시도했었지만 파일을 다운로드까지 가능했지만 엑셀 파일 데이터가 깨져서 보이지 않거나 [Object][object] 였던가.. 이런식으로 보이게 되었다 어쨋든 기능 구현은 성공했으니 메모도 할겸 끄적끄적해봐야겠다. axios 요청 후 받은 응답 헤더를 네트워크 창을 통해서 본 정보이다. 위 사진에서 보이는 것처럼 Content-Dispostion은 .xlsx이며 Content-Type은 .sheet이다. console.log로 받아온 데이터를 보면 아래처럼 이상한 글자가 나온다... PK jA‹S‘ÛÀ Yð[Conten..

React 2021.12.11