AWS S3 에서 파일 로드시 CORS 에러 해결 방법
- 아마존 S3에서 CSS 파일 로드시 내부 url의 경로 파일(font등) 로드시 CORS(Cross-Origin Resource Sharing) 에러 발생하는 상황 해결법
- 403 Forbidden 에러 발생 해결 포함
//-------------------------------------
Amazon S3 > 버킷 > 권한 선택
- 버킷 정책 -> 편집
- 403 Forbidden 에러 해결
- 설정 변경후 적용에 10초 이상 걸릴 수 있음
"Condition": {
"StringLike": {
"aws:Referer": [
"https://S3 URL Root/*", <== 추가
//-------------------------------------
- 정책 CORS(Cross-origin 리소스 공유) -> 편집
- 메뉴위치 : 버킷 권한 페이지 하단에 위치
- CORS error 해결
[
{
"AllowedHeaders": [
"*"
],
"AllowedMethods": [
"GET"
],
"AllowedOrigins": [
"https://서비스 도메인"
],
"ExposeHeaders": []
}
]
//-----------------------------------------------------------------------------
// 참고
https://docs.aws.amazon.com/ko_kr/AmazonS3/latest/userguide/cors.html
https://docs.aws.amazon.com/ko_kr/AmazonS3/latest/userguide/ManageCorsUsing.html
https://aws.amazon.com/ko/premiumsupport/knowledge-center/s3-configure-cors/
[
{
"AllowedHeaders": [
"Authorization"
],
"AllowedMethods": [
"GET",
"HEAD"
],
"AllowedOrigins": [
"example.com"
],
"ExposeHeaders": [
"Access-Control-Allow-Origin"
]
}
]
//-----------------------------------------------------------------------------
* AllowedHeaders / ExposeHeaders
Content-Type, Origin, Authorization, Cache-Control, Expires, Pragma, sessionId,
Access-Control-Allow-Origin, Cross-Origin-Resource-Policy
Accept, DNT, Keep-Alive, User-Agent,
X-Requested-With, If-Modified-Since, Content-Range, Range
* AllowedMethods
GET, HEAD, OPTIONS, PUT, PATCH, POST, DELETE