프론트엔드 개발자 분이 작업하시는 걸 지켜보고 있다가 문득 이상한 현상을 확인했다.
서비스는 React + Next로 되어있었는데, localhost로 돌리는 서비스가 자꾸만 https로 보내지는 현상이었다.
(Next.js 프록시 서버로 api 요청이 간다)
Axios에 전역 설정으로 뭘 잡아두셨나? 했는데 그것도 아니었고,
Next의 server 쪽에 https 세팅을 해두셨나 했는데 그것도 아니었다.
config에 https를 잘못 적었나 싶어 전체 검색을 돌려봤으나 해당 문제도 아니었다.
뭔가 기이한 일이라 한번 봐보겠다고 이야기를 드렸다.
코드 어디에도 문제가 될 부분은 없었으나 동작을 안 하는 게 이상했고,
몇 주 전 같이 작업했을 때까지만 해도 없던 이슈라서,
마지막으로 내가 같이 작업했던 부분(3주 정도 전)의 커밋을 기준으로 업앤다운으로 브랜치를 따 돌며 무식하게 디버깅했다.
확인해보니 head를 지정해둔 해당 코드가 문제가 되었음을 알게 되었다.
<meta httpEquiv="Content-Security-Policy" content="upgrade-insecure-requests" />
해당 코드는 브라우저를 통해 해당 요청을 ssl 형태로 보내라고 강제하는 설정이다.
초반에 카카오톡 맵 api 때문에 추가했다가 developer 세팅을 하고 나니 필요가 없어졌는데,
이 친구가 잔류해있다가 오류를 터뜨린 거였다.
저런 문제가 있으면 어련히 config 쪽 문제라고 생각해 뒤졌는데 전혀 다른 곳 이슈라서 헤매게 된 것 같다.
생각해보면 최근 outline docker 파일을 작업할 때도 강제로 ssl로 보내게 하는 설정 같은 게 있는 걸 확인했는데,
어쩌면 브라우저 입장에서는 ssl 통신을 한다는 것이 내가 아는 것보다 더 확장적인 의미를 가지고 있을지도 모르겠다.
