반응형
CORS
= Cross Origin Resourse Sharing, 교차 출처 리소스 공유
= 서로 다른 도메인 또는 포트에서 데이터(ex) API의 요청, 응답)를 주고 받을 수 있도록 하기 위한 정책, 메커니즘
예를 들어, 다른 도메인에서 이미지를 가져오거나 웹폰트,css를 가져와서 사용하는 것
CORS의 등장 이유
- Same-Origin Policy, 동일 출처 정책 때문이다, Same-Origin Policy는 다른 출처에서 가져온 리소스와 상호작용하는 것을 제한 하는 보안방식으로 서로 다른 origin에서의 자원 공유를 제한한다.
- Same-Origin Policy 적용시 다른 origin 에서의 자원 요청이 불가능하기 때문에, SPA에서 클라이언트와 서버의 도메인을 따로 유지하는 경우 자원공유를 할 수 없게 된다.
+ Same-Origin Policy
- 보안을 위해 프로토콜, 호스트, 포트가 동일한 서버로만 데이터를 주고받을 수 있도록 한 정책
CORS 에러(요청 허가) 해결
- 미들웨어 설치, 설정
npm install cors
- 프록시방식 사용
- 프론트에서 요청 header에 'Access-Control-Allow-Origin:'도메인:포트 or *(모든도메인)' 옵션 사용
'🔥 🔥' 카테고리의 다른 글
모듈 번들러, 트랜스 파일러 (0) | 2020.12.18 |
---|---|
Call Stack (0) | 2020.12.17 |
LocalStorage, SessionStorage, Cookie (0) | 2020.12.11 |
네트워크 기본 지식 (0) | 2020.12.09 |
SSR, CSR과 SPA의 등장배경 (0) | 2020.12.09 |