[AWS] cross-origin resource sharing error: MissingallowOriginHeader (CORS error) 오류 발생시

해당 작업은 S3에 저장되어 있는 파일을 다운로드하거나 접근시 발생하는 에러이다.

 

에러를 살펴보면 다음과 같다.

1) Status : CORS error
2) Type : fetch
3) 원인 : cross-origin resource sharing error: MissingallowOriginHeader

 

이 경우 Cloudfront를 사용하고 있을 경우가 굉장히 크다.

사용자(접근자)의 Region과 구축되어 있는 S3 Region이 달라 해당 에러가 발생한다.

 

필자는 Cloudfront <-> S3 <-> API Gateway 구성이였다.

---

1) 해결방법

1) API Gateway 접속
2) "Develop" - "CORS"
3) Configure CORS - "Configure" 클릭

4) Access-Control-Allow-Origin 부분에 *을 넣고 Add
5) Access-Control-Allow-Headers 부분에 *을 넣고 Add
6) Save

완료.