20230119 TIL axios, msw에서 헤더를 다루는 법

 

결제 관련해서 303 See Other 응답에서 header로 redirect url을 보내주기 때문에,

axios와 msw에서 헤더를 다뤄야 했는데 처음 해봐서 살짝 헤매긴 했지만 공식 문서를 보고 해결을 하였다.

axios에서 응답값의 header 중 Location에 해당하는 값을 가져오려면

response.headers.location 처럼 받아올 수 있다.

https://axios-http.com/docs/res_schema

테스트 서버에서도 실제 서버처럼 header에 Location을 실어 보내줘야 했는데,

msw에서는 아래와 같이 res안에 ctx.set(key, value)로 헤더를 넣어줄 수 있다.

 

이로써 결제 redirection에 대한 어려운 부분도 해결하였다.

 

하지만 redirect하는 과정에서 카카오페이측 서버가 CORS 설정을 해두지 않아

어쩔 수 없이 url을 body로 받아서 직접 이동시키는 방법을 이용하게 되었다.

 

알고 보면 어렵지 않지만 처음이 항상 어려운 것 같다.

항상 공식 문서를 먼저 찾아보도록 하고,

너무 오래 걸린다면 일단 넘기고 다른 업무를 하다가 다시 돌아와서 해결을 하도록 하자!