React에서 CORS 에러 해결

SOP (Same-Origin Policy)


Same-Origin Policy의 줄임말, 동일 출처 정책을 뜻함

동일 출처 정책 : 어떤 출처에서 불러온 문서나 스크립트가 다른 출처에서 가져온 리소스와 상호작용하는 것을 제한하는 보안 방식

⇒ 같은 출처의 리소스만 공유가 가능하다는 정책

출처는 프로토콜,호스트, 포트의 조합으로 되어있음

ex) https://www.codestates.com:443/course

https:// ⇒ 프로토콜

www.codestates.com:443 ⇒ 호스트

443 ⇒ 포트

<https://www.codestates.com:443> ⇒ 출처(Origin)

ex)

http://www.codestates.com vs https://www.codestates.com

⇒ 두 URI는 프로토콜이 다르기 때문에 동일 출처가 아님(https / http)

ex)

https://urclass.codestates.com vs https://codestates.com

⇒ 두 URI는 호스트가 다르기 때문에 동일 출처가 아님 (urclass.codestates.com / codestates.com)