

# CloudWatch RUM을 사용하도록 웹 애플리케이션 설정
<a name="CloudWatch-RUM-get-started"></a>

이 섹션의 단계를 사용하여 실제 사용자 세션에서 성능 데이터를 수집하는 데 CloudWatch RUM을 사용하도록 웹 애플리케이션을 설정합니다.

**Topics**
+ [웹 애플리케이션에서 데이터를 AWS로 전송하도록 권한 부여](CloudWatch-RUM-get-started-authorization.md)
+ [웹 애플리케이션용 CloudWatch RUM 앱 모니터 생성](CloudWatch-RUM-get-started-create-app-monitor.md)
+ [코드 조각을 수정하여 CloudWatch RUM 웹 클라이언트 구성(선택 사항)](CloudWatch-RUM-modify-snippet.md)
+ [애플리케이션에 CloudWatch 앱 모니터 코드 조각 삽입](CloudWatch-RUM-get-started-insert-code-snippet.md)
+ [사용자 이벤트를 생성하여 CloudWatch 앱 모니터 설정 테스트](CloudWatch-RUM-get-started-generate-data.md)

# 웹 애플리케이션에서 데이터를 AWS로 전송하도록 권한 부여
<a name="CloudWatch-RUM-get-started-authorization"></a>

데이터 인증을 설정하는 4가지 옵션이 있습니다.
+ Amazon Cognito를 사용하고 CloudWatch RUM에서 애플리케이션에 대한 새 Amazon Cognito ID 풀을 생성할 수 있습니다. 이 방법은 설정하는 데 최소한의 노력이 필요합니다.

  자격 증명 풀에는 인증되지 않은 자격 증명이 포함됩니다. 이렇게 하면 CloudWatch RUM 웹 클라이언트가 애플리케이션 사용자를 인증하지 않고도 CloudWatch RUM에 데이터를 전송할 수 있습니다.

  Amazon Cognito 자격 증명 풀에는 연결된 IAM 역할이 있습니다. Amazon Cognito 인증되지 않은 자격 증명을 사용하면 웹 클라이언트가 CloudWatch RUM에 데이터를 전송할 수 있는 권한이 부여된 IAM 역할을 맡을 수 있습니다.
+ 인증에 Amazon Cognito를 사용합니다. 이를 사용하는 경우 기존 Amazon Cognito ID 풀을 사용하거나 이 앱 모니터와 함께 사용할 새 ID 풀을 생성할 수 있습니다. 기존 ID 풀을 사용하는 경우 ID 풀에 연결된 IAM 역할도 수정해야 합니다. 인증되지 않은 사용자를 지원하는 자격 증명 풀에 이 옵션을 사용합니다. 동일한 리전의 자격 증명 풀만 사용할 수 있습니다.
+ 이미 설정한 기존 자격 증명 공급자의 인증을 사용합니다. 이 경우 자격 증명 공급자로부터 자격 증명을 가져와야 하며 애플리케이션은 이러한 자격 증명을 RUM 웹 클라이언트에 전달해야 합니다.

  인증된 사용자만 지원하는 자격 증명 풀에 이 옵션을 사용합니다.
+ 리소스 기반 정책을 사용하여 앱 모니터에 대한 액세스를 관리합니다. 여기에는 AWS 자격 증명 없이 인증되지 않은 요청을 CloudWatch RUM으로 보내는 기능이 포함됩니다. 리소스 기반 정책에 대해 자세히 알아보려면 [CloudWatch RUM에서 리소스 기반 정책 사용](CloudWatch-RUM-resource-policies.md) 단원을 참조하세요.

다음 섹션에서는 이러한 옵션에 대해 상세히 알아봅니다.

## 기존 Amazon Cognito 자격 증명 풀을 사용
<a name="CloudWatch-RUM-get-started-authorization-existingcognito"></a>

Amazon Cognito ID 풀을 사용하도록 선택한 경우 애플리케이션을 CloudWatch RUM에 추가할 때 ID 풀을 지정합니다. 풀은 인증되지 않은 자격 증명에 대한 액세스를 활성화할 수 있도록 지원해야 합니다. 동일한 리전의 자격 증명 풀만 사용할 수 있습니다.

또한 이 자격 증명 풀과 관련된 IAM 역할에 연결된 IAM 정책에 다음 권한을 추가해야 합니다.

------
#### [ JSON ]

****  

```
{
    "Version":"2012-10-17",		 	 	 
    "Statement": [
        { 
            "Effect": "Allow",
            "Action": [
                "rum:PutRumEvents"
            ],
            "Resource": "arn:aws:rum:us-east-1:123456789012:appmonitor/app monitor name" 
        }
    ]
}
```

------

Amazon Cognito는 애플리케이션이 CloudWatch RUM에 액세스할 수 있도록 필요한 보안 토큰을 전송합니다.

## 서드 파티 공급자
<a name="CloudWatch-RUM-get-started-authorization-thirdparty"></a>

서드 파티 공급자로부터 프라이빗 인증을 사용하는 경우 자격 증명 공급자로부터 자격 증명을 가져와 AWS로 전달해야 합니다. 이를 수행하는 가장 좋은 방법은 *보안 토큰 공급 업체*를 이용하는 것입니다. AWS Security Token Service와 함께 Amazon Cognito를 포함한 모든 보안 토큰 공급 업체를 이용할 수 있습니다. AWS STS에 대한 자세한 내용은 [AWS Security Token Service API 참조 소개](https://docs.aws.amazon.com/STS/latest/APIReference/welcome.html)를 참조하세요.

이 시나리오에서 Amazon Cognito를 토큰 공급 업체로 사용하려면 인증 공급자와 함께 작동하도록 Amazon Cognito를 구성할 수 있습니다. 자세한 내용은 [Amazon Cognito 자격 증명 풀 시작(페더레이션 자격 증명)](https://docs.aws.amazon.com/cognito/latest/developerguide/getting-started-with-identity-pools.html)을 참조하세요.

자격 증명 공급자와 함께 작동하도록 Amazon Cognito를 구성한 후에는 다음을 수행해야 합니다.
+ 다음 권한을 가진 IAM 역할을 만듭니다. 애플리케이션은 이 역할을 사용하여 AWS에 액세스합니다.

------
#### [ JSON ]

****  

  ```
  { 
   "Version":"2012-10-17",		 	 	 
   "Statement": [ 
     { 
       "Effect": "Allow",
       "Action": "rum:PutRumEvents",
       "Resource": "arn:aws:rum:us-east-2:123456789012:appmonitor/AppMonitorName"
     }
   ]
  }
  ```

------
+ 애플리케이션에 다음을 추가하여 공급자의 자격 증명을 CloudWatch RUM으로 전달하도록 합니다. 사용자가 애플리케이션에 로그인하고 AWS에 액세스하는 데 사용할 자격 증명을 받은 후 실행되도록 라인을 삽입합니다.

  ```
  cwr('setAwsCredentials', {/* Credentials or CredentialProvider */});
  ```

AWS JavaScript SDK의 자격 증명 공급자에 대한 자세한 내용은 JavaScript SDK용 v3 개발자 가이드에서 [웹 브라우저에서 자격 증명 설정](https://docs.aws.amazon.com/sdk-for-javascript/v3/developer-guide/setting-credentials-browser.html), JavaScript SDK용 v2 개발자 가이드에서 [웹 브라우저에서 자격 증명 설정](https://docs.aws.amazon.com/sdk-for-javascript/v2/developer-guide/setting-credentials-browser.html) 및 [@aws-sdk/credential-providers](https://www.npmjs.com/package/@aws-sdk/credential-providers)를 참조하세요.

CloudWatch RUM 웹 클라이언트용 SDK를 사용하여 웹 클라이언트 인증 방법을 구성할 수도 있습니다. 웹 클라이언트 SDK에 대한 자세한 내용은 [CloudWatch RUM 웹 클라이언트 SDK](https://github.com/aws-observability/aws-rum-web)를 참조하세요.

# 웹 애플리케이션용 CloudWatch RUM 앱 모니터 생성
<a name="CloudWatch-RUM-get-started-create-app-monitor"></a>

애플리케이션에서 CloudWatch RUM을 사용하려면 *앱 모니터*를 생성합니다. 앱 모니터가 생성되면 RUM은 사용자가 애플리케이션에 붙여넣을 수 있도록 코드 조각을 생성합니다. 코드 조각은 RUM 클라이언트 코드를 가져옵니다. RUM 클라이언트는 애플리케이션의 사용자 세션에서 데이터를 캡처한 후 이를 RUM으로 전송합니다.

## 웹 플랫폼용 앱 모니터를 생성하려면
<a name="web-platform-app-monitor"></a>

1. [https://console.aws.amazon.com/cloudwatch/](https://console.aws.amazon.com/cloudwatch/)에서 CloudWatch 콘솔을 엽니다.

1. 탐색 창에서 **Application Signals**, **RUM**을 선택합니다.

1. **앱 모니터 추가(Add app monitor)**를 선택합니다.

1. **앱 모니터 이름(App monitor name)**에서 CloudWatch RUM 콘솔 내에서 이 앱 모니터를 식별하는 데 사용할 이름을 입력합니다.

1. **웹**을 플랫폼으로 선택합니다.

1. **애플리케이션 도메인 목록**에서 애플리케이션에 관리 권한이 있는 등록된 도메인 이름을 입력합니다. 와일드카드 문자 `*`를 사용하여 모든 하위 도메인 또는 최상위 도메인(예: \$1.amazon.com, amazon.\$1, \$1.amazon.\$1)을 허용할 수도 있습니다.

1. **RUM 데이터 수집 구성(Configure RUM data collection)**에서 앱 모니터에서 다음을 각각 수집할지 여부를 지정합니다.
   + **성능 원격 측정(Performance telemetry)**: 페이지 로드 및 리소스 로드 시간에 대한 정보를 수집합니다.
   + **JavaScript 오류**: 애플리케이션에서 발생하는 처리되지 않은 JavaScript 오류에 대한 정보를 수집합니다.

     **JavaScript 오류 스택 트레이스 축소 해제**를 선택하여 축소되지 않은 JavaScript 오류를 디버깅할 수 있습니다. 이 기능을 사용하려면 소스 맵 파일을 Amazon S3 버킷 또는 폴더에 업로드하고 Amazon S3 URI를 제공합니다. 활성화되면 RUM은 이러한 소스 맵을 사용하고 축소되지 않은 스택 트레이스를 추가하여 JavaScript 오류 이벤트를 보강합니다. 활성화한 후에 이 기능은 새 JavaScript 오류 이벤트만 처리하며 이전에 수집된 데이터에서는 사용할 수 없습니다. 자세한 내용은 [JavaScript 오류 스택 트레이스의 축소 해제 활성화](CloudWatch-RUM-JavaScriptStackTraceSourceMaps.md) 섹션을 참조하세요.
   + **HTTP 오류**: 애플리케이션에서 발생하는 HTTP 오류에 대한 정보를 수집합니다.

   이러한 옵션을 선택하면 애플리케이션에 대한 자세한 정보가 제공되지만, 더 많은 CloudWatch RUM 이벤트가 생성되므로 더 많은 요금이 발생합니다.

   이 중 하나를 선택하지 않아도 앱 모니터가 세션 시작 이벤트 및 페이지 ID를 수집하여 운영 체제 유형 및 버전, 브라우저 유형 및 버전, 디바이스 유형 및 위치별 분류를 포함하여 애플리케이션을 사용하는 사용자 수를 확인할 수 있습니다.

1. 샘플링된 사용자 세션에서 사용자 ID 및 세션 ID를 수집할 수 있도록 하려면 **CloudWatch RUM 웹 클라이언트가 쿠키를 설정할 수 있도록 이 옵션 선택(Check this option to allow the CloudWatch RUM Web Client to set cookies)**을 선택합니다. 사용자 ID는 RUM에 의해 임의로 생성됩니다. 자세한 정보는 [CloudWatch RUM 웹 클라이언트 쿠키(또는 유사한 기술)](CloudWatch-RUM-privacy.md#CloudWatch-RUM-cookies)을 참조하세요.

1. **세션 샘플(Session samples)**에서 RUM 데이터를 수집하는 데 사용할 사용자 세션 비율을 입력합니다. 기본값은 100%입니다. 이 수를 줄이면 데이터가 줄어들지만, 요금도 줄어듭니다. RUM 요금에 대한 자세한 내용은 [RUM 요금](CloudWatch-RUM.md#RUMpricing)을 참조하세요.

1. CloudWatch RUM에 대해 수집하는 최종 사용자 데이터는 30일 동안 보존된 다음 자동으로 삭제됩니다. CloudWatch Logs에 RUM 이벤트 복사본을 보관하고 이러한 복사본을 보존하는 기간을 구성하려면 **데이터 스토리지(Data storage)**에서 **애플리케이션 원격 측정 데이터를 CloudWatch Logs 계정에 저장하려면 이 옵션을 선택(Check this option to store your application telemetry data in your CloudWatch Logs account)**을 선택합니다. 기본적으로 CloudWatch Logs 로그 그룹은 데이터를 30일 동안 보존합니다. CloudWatch Logs 콘솔에서 보존 기간을 조정할 수 있습니다.

1. (선택 사항) 앱 모니터에 리소스 기반 정책을 추가하여 앱 모니터에 `PutRumEvents` 요청을 보낼 수 있는 사용자를 제어하도록 선택합니다. **퍼블릭 정책 생성**을 선택하면 누구나 `PutRumEvents` 요청을 앱 모니터로 보낼 수 있는 리소스 정책이 앱 모니터에 연결됩니다. 이 방법에 대한 자세한 내용은 [CloudWatch RUM에서 리소스 기반 정책 사용](CloudWatch-RUM-resource-policies.md) 단원을 참조하세요.

1. 이전 단계에서 리소스 기반 정책을 연결한 경우에는 AWS 자격 증명으로 CloudWatch RUM에 대한 요청에 서명할 필요가 없으며, 권한 부여 설정을 건너뛸 수 있습니다. 그렇지 않으면 **권한 부여**에서 신규 또는 기존 Amazon Cognito ID 풀을 사용할지 여부를 지정하거나 다른 ID 제공업체(idP)를 사용합니다. 새 자격 증명 풀을 만드는 것은 다른 설정 단계가 필요하지 않은 가장 간단한 옵션입니다. 자세한 내용은 [웹 애플리케이션에서 데이터를 AWS로 전송하도록 권한 부여](CloudWatch-RUM-get-started-authorization.md) 섹션을 참조하세요.

   새 Amazon Cognito 자격 증명 풀을 생성하려면 관리 권한이 필요합니다. 자세한 내용은 [CloudWatch RUM을 사용하는 IAM 정책](CloudWatch-RUM-permissions.md) 섹션을 참조하세요.

1. (선택 사항) 기본적으로 애플리케이션에 RUM 코드 조각을 추가하면 웹 클라이언트는 애플리케이션의 모든 페이지에 있는 HTML 코드에 JavaScript 태그를 삽입하여 사용량을 모니터링합니다. 이를 변경하려면 **페이지 구성(Configure pages)**을 선택한 다음 **이 페이지만 포함(Include only these pages)** 또는 **이 페이지 제외(Exclude these pages)** 중 하나를 선택합니다. 그런 다음, 포함하거나 제외할 페이지를 지정합니다. 포함하거나 제외할 페이지를 지정하려면 전체 URL을 입력합니다. 추가 페이지를 지정하려면 **URL 추가(Add URL)**를 선택합니다.

1. 앱 모니터에서 샘플링한 사용자 세션의 AWS X-Ray 추적을 사용하려면 **Active tracing**(활성 추적)을 선택하고 **Trace my service with AWS X-Ray**(으로 내 서비스 추적)을 선택합니다.

   이 옵션을 선택하면 `XMLHttpRequest` 및 `fetch` 요청이 앱 모니터에서 샘플링하는 사용자 세션 중에 수행됩니다. 그런 다음, RUM 대시보드, X-Ray 트레이스 맵 및 트레이스 세부 정보 페이지에서 이러한 사용자 세션의 트레이스와 세그먼트를 볼 수 있습니다. 이러한 사용자 세션은 애플리케이션에 대해 활성화된 후 [Application Signals](CloudWatch-Application-Monitoring-Sections.md)의 클라이언트 페이지로도 표시됩니다.

   CloudWatch RUM 웹 클라이언트에 대한 추가 구성을 변경함으로써 HTTP 요청에 X-Ray 추적 헤더를 추가하여 AWS 관리형 서비스 다운스트림으로 사용자 세션의 엔드 투 엔드 추적을 활성화할 수 있습니다. 자세한 내용은 [X-Ray 종단 간 추적 활성화](CloudWatch-RUM-modify-snippet.md#CloudWatch-RUM-xraytraceheader) 섹션을 참조하세요.

1. (선택 사항) 앱 모니터에 태그를 추가하려면 **태그(Tags)**에서 **새 태그 추가(Add new tag)**를 선택합니다.

   그런 다음, **키(Key)**에서 태그 이름을 입력합니다. **값(Value)**에 태그의 선택적 값을 추가할 수 있습니다.

   다른 태그를 추가하려면 **새 태그 추가(Add new tag)**를 다시 선택합니다.

   자세한 내용은 [AWS 리소스에 태깅](https://docs.aws.amazon.com/general/latest/gr/aws_tagging.html)을 참조하세요.

1. **앱 모니터 추가(Add app monitor)**를 선택합니다.

1. **샘플 코드(Sample code)** 섹션에서 애플리케이션에 추가하는 데 사용할 코드 조각을 복사할 수 있습니다. **JavaScript** 또는 **TypeScript**를 선택하고 NPM을 사용하여 CloudWatch RUM 웹 클라이언트를 JavaScript 모듈로 설치하는 것이 좋습니다.

   또는 콘텐츠 전송 네트워크(CDN)를 사용하는 **HTML**을 선택하여 CloudWatch RUM 웹 클라이언트를 설치합니다. CDN 사용 시의 단점은 웹 클라이언트가 광고 차단기에 의해 차단되는 경우가 많다는 것입니다.

1. **복사(Copy)** 또는 **다운로드(Download)**를 선택한 다음 **완료(Done)**를 선택합니다.

# 코드 조각을 수정하여 CloudWatch RUM 웹 클라이언트 구성(선택 사항)
<a name="CloudWatch-RUM-modify-snippet"></a>

애플리케이션에 삽입하기 전에 코드 조각을 수정하여 여러 옵션을 활성화하거나 비활성화할 수 있습니다. 자세한 내용은 [ CloudWatch RUM 웹 클라이언트 설명서](https://github.com/aws-observability/aws-rum-web/blob/main/docs/cdn_installation.md)를 참조하세요.

이러한 단원에서 논의한 대로 반드시 알고 있어야 하는 4가지 구성 옵션이 있습니다.

## 개인 정보를 포함할 수 있는 리소스 URL 수집 방지
<a name="CloudWatch-RUM-resourceURL"></a>

기본적으로 CloudWatch RUM 웹 클라이언트는 애플리케이션에서 다운로드한 리소스 URL을 기록하도록 구성됩니다. 이러한 리소스에는 HTML 파일, 이미지, CSS 파일, JavaScript 파일 등이 포함됩니다. 일부 애플리케이션의 경우 URL에 개인 식별 정보(PII)가 포함될 수 있습니다.

애플리케이션이 여기에 해당한다면 애플리케이션에 삽입하기 전에 코드 조각 구성에서.`recordResourceUrl: false` 설정을 통해 리소스 URL 수집을 비활성화할 것을 강력히 권장합니다.

## 페이지 보기 수동 기록
<a name="CloudWatch-RUM-pageload"></a>

기본적으로 웹 클라이언트는 페이지가 처음 로드할 때와 브라우저 기록 API가 호출될 때 페이지 보기를 기록합니다. 기본 페이지 ID는 `window.location.pathname`입니다. 그러나 경우에 따라 이 동작을 재정의하고 애플리케이션을 계측하여 페이지 보기를 프로그래밍 방식으로 기록할 수도 있습니다. 이렇게 하면 페이지 ID와 기록 시기를 제어할 수 있습니다. 변수 식별자가 있는 URI(예: `/entity/123` 또는 `/entity/456`)가 있는 웹 애플리케이션을 예로 들어 보겠습니다. 기본적으로 CloudWatch RUM은 경로 이름과 일치하는 고유한 페이지 ID를 가진 각 URI에 대해 페이지 보기 이벤트를 생성하지만, 대신 동일한 페이지 ID로 그룹화할 수 있습니다. 이렇게 하려면 `disableAutoPageView` 구성을 사용하여 웹 클라이언트의 페이지 보기 자동화를 사용하지 않도록 설정하고 `recordPageView` 명령을 사용하여 원하는 페이지 ID를 설정합니다. 자세한 내용은 GitHub의 [Application-specific Configurations](https://github.com/aws-observability/aws-rum-web/blob/main/docs/configuration.md)를 참조하세요.

**임베디드 스크립트 예:**

```
cwr('recordPageView', { pageId: 'entityPageId' });
```

**JavaScript 모듈 예:**

```
awsRum.recordPageView({ pageId: 'entityPageId' });
```

## X-Ray 종단 간 추적 활성화
<a name="CloudWatch-RUM-xraytraceheader"></a>

앱 모니터를 생성할 때 **Trace my service with AWS X-Ray**(으로 내 서비스 추적)을 선택하면 앱 모니터에서 샘플링한 사용자 세션 도중에 만들어진 `XMLHttpRequest` 및 `fetch` 요청 추적을 사용할 수 있습니다. 그런 다음, CloudWatch RUM 대시보드, X-Ray 트레이스 맵 및 트레이스 세부 정보 페이지에서 이러한 HTTP 요청의 트레이스를 볼 수 있습니다.

기본적으로 이러한 클라이언트 측 추적은 다운스트림 서버 측 추적에 연결되지 않습니다. 클라이언트 측 추적을 서버 측 추적에 연결하고 종단 간 추적을 활성화하려면 웹 클라이언트에서 `addXRayTraceIdHeader` 옵션을 `true`로 설정합니다. 이로 인해 CloudWatch RUM 웹 클라이언트가 HTTP 요청에 X-Ray 추적 헤더를 추가합니다.

다음 코드 블록은 클라이언트 측 추적을 추가하는 예를 보여줍니다. 가독성을 위해 이 샘플에서 일부 구성 옵션이 생략됩니다.

```
<script>
    (function(n,i,v,r,s,c,u,x,z){...})(
        'cwr',
        '00000000-0000-0000-0000-000000000000',
        '1.0.0',
        'us-west-2',
        'https://client.rum.us-east-1.amazonaws.com/1.0.2/cwr.js',
        {
            enableXRay: true,
            telemetries: [ 
                'errors', 
                'performance',
                [ 'http', { addXRayTraceIdHeader: true } ]
            ]
        }
    );
</script>
```

**주의**  
HTTP 요청에 X-Ray 추적 헤더를 추가하도록 CloudWatch RUM 웹 클라이언트를 구성하면 요청이 SigV4로 서명된 경우 cross-origin 리소스 공유(CORS)가 실패하거나 요청의 서명이 무효화될 수 있습니다. 자세한 내용은 [ CloudWatch RUM 웹 클라이언트 설명서](https://github.com/aws-observability/aws-rum-web/blob/main/docs/cdn_installation.md)를 참조하세요. 프로덕션 환경에서 클라이언트 측 X-Ray 추적 헤더를 추가하기 전에 애플리케이션을 테스트하는 것을 강력하게 권장합니다.

자세한 내용은 [ CloudWatch RUM 웹 클라이언트 설명서](https://github.com/aws-observability/aws-rum-web/blob/main/docs/cdn_installation.md#http)를 참조하세요.

## CloudWatch RUM에 서명되지 않은 요청 보내기
<a name="CloudWatch-RUM-unsigned"></a>

기본적으로 RUM 웹 클라이언트는 RUM으로 전송되는 모든 요청에 서명합니다. 클라이언트 구성에서 `signing:false`를 설정하면 요청이 CloudWatch RUM으로 전송될 때 서명되지 않습니다. 앱 모니터에 연결된 퍼블릭 리소스 기반 정책이 있는 경우에만 RUM에 데이터가 수집됩니다. 자세한 내용은 [CloudWatch RUM에서 리소스 기반 정책 사용](CloudWatch-RUM-resource-policies.md) 섹션을 참조하세요.

# 애플리케이션에 CloudWatch 앱 모니터 코드 조각 삽입
<a name="CloudWatch-RUM-get-started-insert-code-snippet"></a>

다음으로 이전 섹션에서 생성한 코드 조각을 애플리케이션에 삽입합니다.

**주의**  
코드 조각으로 다운로드 및 구성된 웹 클라이언트는 최종 사용자 데이터를 수집하기 위해 쿠키(또는 유사한 기술)를 사용합니다. 코드 조각을 삽입하기 전에 [콘솔에서 메타데이터 속성별로 필터링CloudWatch RUM을 통한 데이터 보호 및 데이터 프라이버시](CloudWatch-RUM-privacy.md) 섹션을 참고하세요.

이전에 생성된 코드 조각이 없는 경우 [이미 생성한 코드 조각을 찾으려면 어떻게 해야 한가요?](CloudWatch-RUM-find-code-snippet.md) 섹션의 지침에 따라 찾을 수 있습니다.

**애플리케이션에 CloudWatch RUM 코드 조각 삽입**

1. 복사하거나 다운로드한 코드 조각을 애플리케이션의 `<head>` 요소의 이전 섹션에 삽입합니다. `<body>` 요소 또는 기타 `<script>` 태그 앞에 삽입합니다.

   다음은 생성된 코드 조각의 예입니다.

   ```
   <script>
   (function (n, i, v, r, s, c, x, z) {
       x = window.AwsRumClient = {q: [], n: n, i: i, v: v, r: r, c: c};
       window[n] = function (c, p) {
           x.q.push({c: c, p: p});
       };
       z = document.createElement('script');
       z.async = true;
       z.src = s;
       document.head.insertBefore(z, document.getElementsByTagName('script')[0]);
   })('cwr',
       '194a1c89-87d8-41a3-9d1b-5c5cd3dafbd0',
       '1.0.0',
       'us-east-2',
       'https://client.rum.us-east-1.amazonaws.com/1.0.2/cwr.js',
       {
           sessionSampleRate: 1,
           identityPoolId: "us-east-2:c90ef0ac-e3b8-4d1a-b313-7e73cfd21443",
           endpoint: "https://dataplane.rum.us-east-2.amazonaws.com",
           telemetries: ["performance", "errors", "http"],
           allowCookies: true,
           enableXRay: false
       });
   </script>
   ```

1. 애플리케이션이 여러 페이지의 웹 애플리케이션인 경우 데이터 수집에 포함할 각 HTML 페이지에 대해 1단계를 반복해야 합니다.

# 사용자 이벤트를 생성하여 CloudWatch 앱 모니터 설정 테스트
<a name="CloudWatch-RUM-get-started-generate-data"></a>

코드 조각을 삽입하고 업데이트된 애플리케이션이 실행 중이면 수동으로 사용자 이벤트를 생성하여 테스트할 수 있습니다. 이 테스트를 하려면 다음을 수행하는 것이 좋습니다. 이 테스트에서는 표준 CloudWatch RUM 요금이 발생합니다.
+ 웹 애플리케이션의 페이지 사이를 탐색합니다.
+ 서로 다른 브라우저와 디바이스를 사용하여 여러 사용자 세션을 생성합니다.
+ 요청을 생성합니다.
+ JavaScript 오류를 유발합니다.

일부 이벤트를 생성한 후에는 CloudWatch RUM 대시보드에서 해당 이벤트를 확인합니다. 자세한 내용은 [CloudWatch RUM 대시보드 보기](CloudWatch-RUM-view-data.md) 섹션을 참조하세요.

사용자 세션의 데이터가 대시보드에 표시되는 데 최대 15분이 걸릴 수 있습니다.

애플리케이션에서 이벤트를 생성한 후 15분 후에 데이터가 표시되지 않으면 [CloudWatch RUM 문제 해결](CloudWatch-RUM-troubleshooting.md) 섹션을 참조하세요.