4단계. Amazon AppStream 2.0과 통합되도록 웹 사이트 구성 - Amazon AppStream 2.0
appstream-embed JavaScript 파일 가져오기AppStream.Embed 인터페이스 객체 초기화 및 구성AppStream 2.0 사용자 인터페이스에서 항목 숨기기 예시

4단계. Amazon AppStream 2.0과 통합되도록 웹 사이트 구성

다음 섹션에서는 임베디드 AppStream 2.0 스트리밍 세션을 호스트하도록 웹 페이지를 구성하는 방법에 대해 설명합니다.

appstream-embed JavaScript 파일 가져오기

  1. AppStream 2.0 스트리밍 세션을 임베드할 웹 페이지에 다음 코드를 추가하여 appstream-emb.js 파일을 웹 페이지로 가져옵니다.

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

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

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

AppStream.Embed 인터페이스 객체 초기화 및 구성

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에 지정된 값은 전체 AppStream 2.0 도구 모음을 숨깁니다. 예제로 포함되는 이 값은 선택 사항입니다.

sessionUrl

AppStream 2.0 콘솔, CreateStreamingURL API 작업 또는 create-streaming-url AWS CLI 명령을 사용하여 생성한 스트리밍 URL입니다. 이 파라미터는 대소문자를 구분합니다.

유형: 문자열

필수 항목 여부: 예

userInterfaceConfig

사용자 인터페이스 요소의 초기 상태를 생성하는 구성입니다. 구성은 키-값 페어입니다.

이 키(AppStream.Embed.Options.HIDDEN_ELEMENTS)는 처음에 임베디드 AppStream 2.0 스트리밍 세션이 초기화될 때 숨겨지는 사용자 인터페이스 객체를 지정합니다. 나중에 getInterfaceState 파라미터를 사용하여 숨겨진 객체와 보이는 객체를 모두 반환할 수 있습니다.

이 값은 상수의 배열(도구 모음 버튼)입니다. 사용할 수 있는 상수 목록은 HIDDEN_ELEMENTS 작업 단원을 참조하십시오.

유형: 맵(키:값)

필수 항목 여부: 아니요

AppStream 2.0 사용자 인터페이스에서 항목 숨기기 예시

이 섹션의 예시에서는 임베디드 AppStream 2.0 스트리밍 세션 동안 사용자로부터 AppStream 2.0 사용자 인터페이스의 항목을 숨기는 방법을 보여줍니다.

예 1: 전체 AppStream 2.0 도구 모음 숨기기

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

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

예 2: AppStream 2.0 도구 모음에서 특정 버튼 숨기기

임베디드 스트리밍 세션 중에 사용자가 특정 도구 모음 버튼에 액세스하지 못하도록 AppStream 2.0 도구 모음을 표시할 수 있습니다. 이렇게 하려면 숨기려는 버튼에 상수를 지정합니다. 다음 코드는 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: AppStream 2.0 도구 모음에서 여러 버튼 숨기기

임베디드 스트리밍 세션 중에 사용자가 둘 이상의 도구 모음 버튼에 액세스하지 못하도록 AppStream 2.0 도구 모음을 표시할 수 있습니다. 이렇게 하려면 숨기려는 버튼에 상수를 지정합니다. 다음 코드는 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]}
 };