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

# 4단계. Amazon WorkSpaces 애플리케이션과의 통합을 위해 웹 사이트 구성
<a name="configure-website-for-integration"></a>

다음 섹션에서는 임베디드 WorkSpaces 애플리케이션 스트리밍 세션을 호스팅하도록 웹 페이지를 구성하는 방법에 대한 정보를 제공합니다.

**Topics**
+ [appstream-embed JavaScript 파일 가져오기](#import-embed-javascript-file)
+ [`AppStream.Embed` 인터페이스 객체 초기화 및 구성](#initialize-configure-embed-interface-object)
+ [WorkSpaces 애플리케이션 사용자 인터페이스에서 항목을 숨기는 예제](#examples-hiding-user-interface-items)

## appstream-embed JavaScript 파일 가져오기
<a name="import-embed-javascript-file"></a>

1. WorkSpaces 애플리케이션 스트리밍 세션을 포함할 웹 페이지에서 다음 코드를 추가하여 **appstream-embed.js** 파일을 웹 페이지로 가져옵니다.

   ```
   <script type="text/javascript" src="./appstream_embed.js"> </script>
   ```

1. 그런 다음 빈 컨테이너 div를 만듭니다. 설정한 div의 ID는 WorkSpaces 애플리케이션 임베드 생성자로 전달됩니다. 그런 다음 스트리밍 세션용 iframe을 주입하는 데 사용됩니다. div를 만들려면 다음 코드를 추가하십시오.

   ```
   <div id="appstream-container"> </div>
   ```

## `AppStream.Embed` 인터페이스 객체 초기화 및 구성
<a name="initialize-configure-embed-interface-object"></a>

JavaScript에서 `AppStream.Embed` 인터페이스 객체를 초기화하려면 스트리밍 URL 및 사용자 인터페이스 구성에 대한 옵션을 사용하여 `AppStream.Embed` 객체를 생성하는 코드를 추가해야 합니다. 이러한 옵션과 직접 생성한 div ID는 `appstreamOptions`라는 객체에 저장됩니다.

다음 예제 코드는 `AppStream.Embed` 인터페이스 객체를 초기화하는 방법을 보여줍니다.

```
var appstreamOptions = {
     sessionURL: 'https://appstream2.{{region}}.aws.amazon.com/authenticate?parameters={{authenticationcode}}...',
     userInterfaceConfig:{[AppStream.Embed.Options.HIDDEN_ELEMENTS]:[AppStream.Embed.Elements.TOOLBAR]}
 };
 appstreamEmbed = new AppStream.Embed("appstream-container", appstreamOptions);
```

코드에서 {{sessionURL}} 및 {{userInterfaceConfig}}를 고유한 값으로 바꿉니다.

**참고**  
{{userInterfaceConfig}}에 지정된 값은 전체 WorkSpaces 애플리케이션 도구 모음을 숨깁니다. 예제로 포함되는 이 값은 선택 사항입니다.

**{{sessionUrl}}**  
WorkSpaces 애플리케이션 콘솔, [CreateStreamingURL](https://docs.aws.amazon.com/appstream2/latest/APIReference/API_CreateStreamingURL.html) API 작업 또는 [create-streaming-url](https://docs.aws.amazon.com/cli/latest/reference/appstream/create-streaming-url.html) AWS CLI 명령을 사용하여 생성한 스트리밍 URL입니다. 이 파라미터는 대소문자를 구분합니다.  
**유형**: 문자열  
**필수 항목 여부:** 예

**{{userInterfaceConfig}}**  
사용자 인터페이스 요소의 초기 상태를 생성하는 구성입니다. 구성은 키-값 페어입니다.  
키는 임베디드 WorkSpaces 애플리케이션 스트리밍 세션이 초기화될 때 처음 숨겨지는 사용자 인터페이스 객체를 `AppStream.Embed.Options.HIDDEN_ELEMENTS`지정합니다. 나중에 `getInterfaceState` 파라미터를 사용하여 숨겨진 객체와 보이는 객체를 모두 반환할 수 있습니다.  
이 값은 상수의 배열(도구 모음 버튼)입니다. 사용할 수 있는 상수 목록은 [`HIDDEN_ELEMENTS` 작업](constants-functions-events-embedded-sessions.md#constants-hidden-elements) 단원을 참조하십시오.  
**유형**: 맵({{키}}:{{값}})  
**필수 항목 여부**: 아니요

## WorkSpaces 애플리케이션 사용자 인터페이스에서 항목을 숨기는 예제
<a name="examples-hiding-user-interface-items"></a>

이 섹션의 예제에서는 임베디드 WorkSpaces 애플리케이션 스트리밍 세션 중에 WorkSpaces 애플리케이션 사용자 인터페이스의 항목을 사용자에게 숨기는 방법을 보여줍니다.

**Topics**
+ [예제 1: 전체 WorkSpaces 애플리케이션 도구 모음 숨기기](#example-hide-the-entire-tooolbar)
+ [예제 2: WorkSpaces 애플리케이션 도구 모음에서 특정 버튼 숨기기](#example-hide-a-specific-toolbar-button)
+ [예제 3: WorkSpaces 애플리케이션 도구 모음에서 여러 버튼 숨기기](#example-hide-multiple-toolbar-buttons)

### 예제 1: 전체 WorkSpaces 애플리케이션 도구 모음 숨기기
<a name="example-hide-the-entire-tooolbar"></a>

임베디드 스트리밍 세션 중에 사용자가 WorkSpaces 애플리케이션 도구 모음의 버튼에 액세스하지 못하도록 하려면 `AppStream.Embed.Elements.TOOLBAR` 상수를 사용합니다. 이 상수를 사용하면 모든 WorkSpaces 애플리케이션 도구 모음 버튼을 숨길 수 있습니다.

```
var appstreamOptions = {
     sessionURL: 'https://appstream2.{{region}}.aws.amazon.com/authenticate?parameters={{authenticationcode}}...',
     userInterfaceConfig:{[AppStream.Embed.Options.HIDDEN_ELEMENTS]:[AppStream.Embed.Elements.TOOLBAR]}
 };
```

### 예제 2: WorkSpaces 애플리케이션 도구 모음에서 특정 버튼 숨기기
<a name="example-hide-a-specific-toolbar-button"></a>

임베디드 스트리밍 세션 중에 사용자가 특정 도구 모음 버튼에 액세스하지 못하도록 WorkSpaces 애플리케이션 도구 모음을 표시할 수 있습니다. 이렇게 하려면 숨기려는 버튼에 상수를 지정합니다. 다음 코드는 `AppStream.Embed.Elements.FILES_BUTTON` 상수를 사용하여 **내 파일** 버튼을 숨깁니다. 이렇게 하면 사용자가 임베디드 스트리밍 세션 중에 영구 스토리지 옵션에 액세스할 수 없습니다.

```
var appstreamOptions = {
     sessionURL: 'https://appstream2.{{region}}.aws.amazon.com/authenticate?parameters={{authenticationcode}}...',
     userInterfaceConfig:{[AppStream.Embed.Options.HIDDEN_ELEMENTS]:[AppStream.Embed.Elements.FILES_BUTTON]}
 };
```

### 예제 3: WorkSpaces 애플리케이션 도구 모음에서 여러 버튼 숨기기
<a name="example-hide-multiple-toolbar-buttons"></a>

임베디드 스트리밍 세션 중에 사용자가 둘 이상의 도구 모음 버튼에 액세스하지 못하도록 WorkSpaces 애플리케이션 도구 모음을 표시할 수 있습니다. 이렇게 하려면 숨기려는 버튼에 상수를 지정합니다. 다음 코드는 `AppStream.Embed.Elements.END_SESSION_BUTTON` 및 `AppStream.Embed.Elements.FULLSCREEN_BUTTON` 상수를 사용하여 **End Session(세션 종료)** 및 **Fullscreen(전체 화면)** 버튼을 숨깁니다.

**참고**  
앞이나 뒤에 공백 없이 각 상수를 쉼표로 구분합니다.

```
var appstreamOptions = {
     sessionURL: 'https://appstream2.{{region}}.aws.amazon.com/authenticate?parameters={{authenticationcode}}... (https://appstream2.{{region}}.aws.amazon.com/#/)',
     userInterfaceConfig:{[AppStream.Embed.Options.HIDDEN_ELEMENTS]:[AppStream.Embed.Elements.END_SESSION_BUTTON,AppStream.Embed.Elements.FULLSCREEN_BUTTON]}
 };
```