CORS는 무엇이고, CORS 에러를 방지하려면 어떻게 해야하나요?

Cross Origin Resource Sharing의 줄임말로, 서버가 웹 브라우저에서 리소스를 로드할 때, 다른 오리진을 통해 로드하지 못하게 하는 HTTP 헤더 기반 메커니즘입니다.

출처가 다르다는 것은 도메인, 하위도메인, 포트, 프로토콜이 다르다는 것을 의미하는데, CORS에 의해 요청이 차단되지 않으려면 이 네 가지가 모두 동일해야합니다.

 

*오리진: 프로토콜 + 호스트 이름 + 포트의 조합

ex) https://www.naver.com:12010

또는 프론트엔드에서는 프록시 서버를 만들어 동일한 출처로 만드는 방법도 있습니다.

백엔드에는 express의 cors 미들웨어 라이브러리를 사용하거나,

응답 헤더에 Access-Control-Allow-Origin에 허용하고자 하는 도메인을 세팅하는 방법이 있습니다.