Axios header 가공하기

JS로 만들었던 API 파일을 TS로 변환하는 과정에서 다음과 같은 문제가 발생했다. 타입의 문제인 것 같은데 옵셔널체이닝으로 해결하려고 해도 작동을 하지 않았다.

검색을 해도 관련 자료를 찾을 수 없었고 chatGPT는 LoginResponse라는 타입을 만들어서 axios에 제네릭으로 넘겨주면 해결될 것이라고 하였으나 해결되지 않았다.

오늘 코딩테스트 멘토링 시간이 있어서 그리고 마침 매니저님이 프론트엔드 셨기에 혹시나 해서 방법을 여쭤봤다.

내가 필요로하는 것은 data와 headers였는데 data는 제너릭으로 any를 기본타입으로 줘서 상관이 없었지만 headers는 타입이 두 가지로 정해져있었는데 내 코드에서는 null이나 undefined일 수 있어서 안 받아주는 문제가 있었다.

그래서 일단 headers에서 호출하는 타입을 계속 타고 갔는데 대부분 순환 참조였고

여기로 귀결되었다.
그래서 axiosHeader라는 변수를 하나 새로 만들고 AxiosHeaders로 강제 타입캐스팅을 해서 해결했다.

앞으로 비슷한 타입 문제가 발생했을 때 해당 라이브러리를 타고가서 어떤 타입을 참조하는 지 확인하고, 정 안 되면 타입캐스팅을 사용하는 방법을 기억해놓아야겠다.