

기계 번역으로 제공되는 번역입니다. 제공된 번역과 원본 영어의 내용이 상충하는 경우에는 영어 버전이 우선합니다.

# Lightsail의 교차 오리진 리소스 공유(CORS)
<a name="configure-cors"></a>

교차 오리진 리소스 공유(CORS) 한 도메인에서 로드되어 다른 도메인에 있는 리소스와 상호 작용하는 클라이언트 웹 애플리케이션에 대한 방법을 정의합니다. CORS 지원을 통해 Lightsail 객체 스토리지로 강력한 클라이언트 측 웹 애플리케이션을 구축하고, 버킷 리소스에 대한 교차 오리진 액세스를 선택적으로 허용할 수 있습니다. CORS에 대한 자세한 내용은 [CORS란 무엇인가요?](https://aws.amazon.com/what-is/cross-origin-resource-sharing/)를 참조하세요.

이 섹션은 AWS Command Line Interface(AWS CLI)를 사용하여 Lightsail 버킷에 대해 CORS를 구성하는 방법을 보여줍니다. 교차 오리진 요청을 허용하도록 버킷을 구성하려면, 버킷에 대한 액세스를 허용할 오리진, 각 오리진에 대해 지원할 작업(HTTP 메서드) 및 기타 작업 특정 정보를 식별하는 규칙을 정의하는 JSON 문서를 사용하여 버킷에 CORS 구성을 추가합니다.

**Topics**
+ [CORS 사용 사례](#cors-use-cases)
+ [Lightsail이 CORS 구성을 평가하는 방법](cors-how-evaluation-works.md)
+ [AWS CLI를 사용하여 CORS 구성](cors-configuration-cli.md)
+ [CORS 문제 해결](cors-troubleshooting.md)

## CORS 사용 사례
<a name="cors-use-cases"></a>

다음 예제 시나리오는 Lightsail 버킷에 CORS를 구성할 필요가 있는 방법을 설명합니다.

**시나리오: 웹 글꼴 호스팅**  
Lightsail 버킷에서 웹 글꼴을 호스팅한다고 가정해 보겠습니다. 브라우저는 웹 글꼴을 불러오기 위해 CORS 검사(사전 검사라고도 함)가 필요합니다. 웹 글꼴을 호스팅하는 버킷이 이러한 요청을 하는 오리진을 허용하도록 구성합니다.

# Lightsail이 CORS 구성을 평가하는 방법
<a name="cors-how-evaluation-works"></a>

Lightsail 객체 스토리지는 브라우저에서 사전 요청을 받으면 버킷에 대한 CORS 구성을 평가하여, 수신된 브라우저 요청과 일치하는 첫 번째 CORS 규칙을 사용하여 교차 오리진 요청을 허용합니다. 규칙이 일치하려면 다음 조건이 충족되어야 합니다.
+ 요청의 `Origin` 헤더는 `AllowedOrigins` 요소의 오리진과 일치해야 합니다.
+ `Access-Control-Request-Method` 헤더에 지정된 HTTP 메서드는 `AllowedMethods` 요소의 메서드와 일치해야 합니다.
+ `Access-Control-Request-Headers` 헤더에 나열된 헤더는 `AllowedHeaders` 요소의 헤더와 일치해야 합니다.

**참고**  
버킷에 CORS를 활성화하면 버킷 권한이 계속 적용됩니다. CORS 구성은 브라우저에서 교차 오리진 요청이 진행되도록 허용할지 여부만 결정합니다. 자세한 내용은 [Lightsail 버킷 및 객체에 대한 액세스 제어](amazon-lightsail-understanding-bucket-permissions.md) 섹션을 참조하세요.

## CORS 구성의 요소
<a name="cors-configuration-elements"></a>

CORS 구성은 CORS 규칙 배열을 포함하는 JSON 문서입니다. 각 규칙은 버킷에 대한 액세스가 허용되는 오리진, 허용되는 HTTP 메서드 및 기타 구성 옵션을 정의합니다.

다음 요소를 CORS 규칙에 포함할 수 있습니다.

**allowedOrigins**  
버킷에 대한 액세스가 허용되는 오리진을 지정합니다. 와일드카드(\$1)를 사용하여 모든 오리진을 허용하거나 `https://example.com`과 같은 특정 도메인을 지정할 수 있습니다.

**allowedMethods**  
지정된 오리진에 대해 허용되는 HTTP 메서드를 지정합니다. 유효한 값에는 GET, PUT, POST, DELETE, HEAD가 포함됩니다.

**allowedHeaders**  
Access-Control-Request-Headers 헤더를 통해 사전 OPTIONS 요청에 허용되는 헤더를 지정합니다.

**exposeHeaders**  
클라이언트 애플리케이션에서 액세스할 수 있는 응답 헤더를 지정합니다.

**id**  
CORS 규칙의 고유 식별자입니다.

**maxAgeSeconds**  
브라우저가 사전 요청에 대한 응답을 캐싱할 수 있는 시간을 초 단위로 지정합니다.

이러한 파라미터에 대한 자세한 내용은 *Amazon Lightsail API 레퍼런스*의 [BucketCorsRule](https://docs.aws.amazon.com/lightsail/2016-11-28/api-reference/API_BucketCorsRule.html)을 참조하세요.

# AWS CLI를 사용하여 CORS 구성
<a name="cors-configuration-cli"></a>

`--cors` 파라미터와 함께 AWS CLI를 사용하여 Lightsail 버킷에 대한 CORS를 구성할 수 있습니다. 이 파라미터는 CORS 구성이 포함된 JSON 파일을 수락합니다. CORS 구성의 요소에 대한 자세한 내용은 [CORS 구성의 요소](cors-how-evaluation-works.md#cors-configuration-elements) 섹션을 참조하세요.

**Topics**
+ [CORS 구성 적용](#cors-configuration-apply)
+ [예제 CORS 구성](#cors-configuration-examples)
+ [CORS 구성 제거](#cors-remove-configuration)

## CORS 구성 적용
<a name="cors-configuration-apply"></a>

다음 절차는 JSON 파일을 지정하여 버킷에 CORS 구성을 적용할 수 있는 방법을 보여줍니다. 더 많은 예제 구성은 [예제 CORS 구성](#cors-configuration-examples) 섹션을 참조하세요.

**AWS CLI를 사용하여 버킷에 대한 CORS를 구성하려면**

1. CORS 구성이 포함된 JSON 파일을 생성합니다. 예를 들어, 다음 콘텐츠가 포함된 `cors-config.json`이라는 파일을 생성합니다.

   ```
   {
     "CORSRules": [
       {
         "AllowedOrigins": ["https://example.com"],
         "AllowedMethods": ["GET", "PUT", "POST"],
         "AllowedHeaders": ["*"],
         "MaxAgeSeconds": 3000
       }
     ]
   }
   ```

1. AWS CLI를 사용하여 버킷에 CORS 구성을 적용합니다.

   ```
   aws lightsail update-bucket --bucket-name amzn-s3-demo-bucket --cors file://cors-config.json
   ```

1. CORS 구성이 성공적으로 적용되었는지 확인합니다.

   ```
   aws lightsail get-buckets --bucket-name amzn-s3-demo-bucket --include-cors
   ```

**참고**  
*amzn-s3-demo-bucket*을 Lightsail 버킷 이름으로 바꿉니다.

## 예제 CORS 구성
<a name="cors-configuration-examples"></a>

다음 예제는 다양한 사용 사례에 대한 일반적인 CORS 구성을 보여줍니다.

**예제 1: 모든 오리진 및 메서드 허용**  
이 구성을 사용하면 모든 오리진이 HTTP 메서드를 사용하여 버킷에 액세스할 수 있습니다.

```
{
    "CORSRules": [
      {
        "AllowedOrigins": ["*"],
        "AllowedMethods": ["GET", "PUT", "POST", "DELETE", "HEAD"],
        "AllowedHeaders": ["*"],
        "MaxAgeSeconds": 3000
      }
    ]
  }
```

**예제 2: 특정 도메인으로 제한**  
이 구성은 `https://mywebsite.com`의 요청만 허용합니다.

```
{
    "CORSRules": [
      {
        "AllowedOrigins": ["https://mywebsite.com"],
        "AllowedMethods": ["GET", "PUT"],
        "AllowedHeaders": ["Authorization", "Content-Type"],
        "ExposeHeaders": ["ETag"],
        "MaxAgeSeconds": 3600
      }
    ]
  }
```

**예제 3: 서로 다른 오리진에 대한 다중 규칙**  
이 구성은 서로 다른 오리진에 대해 서로 다른 규칙을 정의합니다.

```
{
    "CORSRules": [
      {
        "AllowedOrigins": ["https://mywebsite.com"],
        "AllowedMethods": ["GET", "PUT", "POST"],
        "AllowedHeaders": ["*"],
        "MaxAgeSeconds": 3600
      },
      {
        "AllowedOrigins": ["https://cdn.mywebsite.com"],
        "AllowedMethods": ["GET"],
        "AllowedHeaders": ["Authorization"],
        "MaxAgeSeconds": 86400
      }
    ]
  }
```

## CORS 구성 제거
<a name="cors-remove-configuration"></a>

버킷에서 CORS 구성을 제거하려면 다음 AWS CLI 명령을 사용합니다.

```
aws lightsail update-bucket --bucket-name amzn-s3-demo-bucket --cors '{"rules":[]}'
```

**참고**  
*amzn-s3-demo-bucket*을 Lightsail 버킷의 이름으로 바꿉니다.

CORS 구성을 제거한 후에는 브라우저에서 버킷에 대한 교차 오리진 요청을 차단합니다.

# CORS 문제 해결
<a name="cors-troubleshooting"></a>

CORS에 문제가 있는 경우 다음을 확인하세요.
+ **CORS 구성 확인** - CORS 구성이 올바른 형식의 JSON이고 사용 사례에 필요한 규칙이 포함되어 있는지 확인합니다.
+ **오리진 일치 확인** - 요청의 오리진은 `AllowedOrigins` 목록의 항목과 정확하게 일치해야 합니다. 프로토콜(http/https), 하위 도메인 및 포트가 정확하게 일치해야 합니다.
+ **HTTP 메서드 확인** - 사용하는 HTTP 메서드가 일치하는 규칙의 `AllowedMethods`에 나열되어 있는지 확인합니다.
+ **브라우저 개발자 도구 확인** - 브라우저의 개발자 도구를 사용하여 사전 OPTIONS 요청 및 응답을 검사하여 CORS 관련 오류를 식별합니다.
+ **버킷 권한 검증** - 버킷에 CORS 외에도 적절한 권한이 구성되어 있는지 확인합니다. CORS는 브라우저 기반 교차 오리진 액세스만 제어하며 버킷 수준 권한은 제어하지 않습니다.

문제를 해결하는 동안 버킷에서 CORS 구성을 제거해야 하는 경우 [CORS 구성 제거](cors-configuration-cli.md#cors-remove-configuration) 섹션을 참조하세요.