슈퍼개발자, 춤추는망고입니다.

( 춤 안춥니다. )

앞으로 이 시리즈는 짤막하지만 실용적인 내용들을 담을겁니다!

프론트와 백, 통신을 위해서라면!

End-Point 연결에 필수!

CORS!

CORS 가 뭔데 ?

Cross-Origin Resource Sharing

교차출처 자원공유라는 뜻인데요 !

도메인이나 포트가 다른 임의의 서버에 있는 자원에 대한 공유라는 개념이에요!

왜 갑자기 CORS ?

Front-End ( Client-Side ) 와 Back-End ( Server-Side ) 는

서로 다른 환경 ( 도메인, 포트 ) 에서 동작하기 때문에,
HTTP 통신을 통해, 정보를 주고받는데요 !

이때, HTTP 라는 통신규약의 한 정책인,
동일출처 정책 ( Same-Origin Policy ) 때문에,
브라우저에서 외부 데이터에 대한 접근을 차단해요 !

리소스와 상호작용하는 과정에서 생길 수 있는 보안적인 문제 때문쓰 !

사용자 ( Clinent ) 가

서버 ( Server ) 에서 보낸 정보를 사용하지 못한다는 뜻이죠 !

그러면 어떻게 해야되 ?

서버 쪽에서 HTTP 통신을 할 때

요청할 때엔,

 - Origin
 - Access-Control-Request-Method
 - Access-Control-Request-Headers

응답할 때엔,

 - Access-Control-Allow-Origin
 - Access-Control-Allow-Credentials
 - Access-Control-Expose-Headers
 - Access-Control-Max-Age
 - Access-Control-Allow-Methods
 - Access-Control-Allow-Headers

등의 값을 Header 에 추가하여,
자원 ( 정보 ) 에 대한 접근권한을 허용해 줘야해요!

프론트엔드와 백엔드의 분리!

조심할 부분이 많아요!

출처쓰!

위키피디아 !
https://ko.wikipedia.org/wiki/%EA%B5%90%EC%B0%A8_%EC%B6%9C%EC%B2%98_%EB%A6%AC%EC%86%8C%EC%8A%A4_%EA%B3%B5%EC%9C%A0

' Jin-Young Lee ' 님의 Velog 글 !
https://velog.io/@wlsdud2194/cors