[TIL / 3일차] 'CORS 에러' 경험

프론트엔드와 백엔드 서버를 처음 연결해 API를 호출했는데, 콘솔창에 새빨간 CORS policy 에러가 떠서 서버가 터진 줄 알고 식은땀을 흘렸습니다.

알고 보니 서버 문제가 아니라, 출처가 다르면 브라우저가 보안상 응답을 차단하는 동일 출처 정책 때문이었습니다.

우리 팀은 프론트가 3000번, 백엔드가 8080번 포트를 써서 브라우저 입장에서는 서로를 낯선 접근으로 인식했던 것입니다.

이를 해결하기 위해 백엔드 팀원과 소통하여, 서버 설정에 프론트엔드의 주소만 명확히 허용해 주는 CORS 매핑 코드를 추가했습니다.

단순한 에러 해결을 넘어 웹 브라우저의 보안 원리를 깊게 이해하게 되었고, 프론트와 백엔드의 긴밀한 소통이 얼마나 중요한지 뼈저리게 깨달았습니다!