Incorporamento delle sessioni di streaming di AppStream 2.0 - Amazon AppStream 2.0

Le traduzioni sono generate tramite traduzione automatica. In caso di conflitto tra il contenuto di una traduzione e la versione originale in Inglese, quest'ultima prevarrà.

Incorporamento delle sessioni di streaming di AppStream 2.0

Puoi creare un'esperienza dinamica, interattiva e personalizzata per gli utenti incorporando una sessione di streaming di AppStream 2.0 all'interno del sito Web. Le sessioni di streaming incorporate di AppStream 2.0 consentono agli utenti di interagire con modelli 3D, mappe e set di dati direttamente dal proprio sito Web. Ad esempio, gli utenti possono visualizzare istruzioni di formazione o materiale didattico insieme alla sessione di streaming AppStream 2.0.

Prerequisiti

Per incorporare una sessione di streaming di AppStream 2.0, devi disporre di quanto segue:

Raccomandazioni e considerazioni di utilizzo

Tieni presente i seguenti suggerimenti e note sull'utilizzo per le sessioni di streaming incorporate di AppStream 2.0.

  • Per mantenere il massimo controllo sull'esperienza di streaming incorporata di AppStream 2.0 per gli utenti, è consigliabile configurare URL di streaming di breve durata (circa 5 secondi). Qualsiasi utente può controllare il contenuto di una pagina Web e visualizzarne la fonte. Questo include il documento object model (DOM) e l'URL src (source) dell'iframe. Se l'URL è ancora valido quando viene copiato dall'utente, quest'ultimo può incollarlo in una scheda separata del browser ed eseguire lo streaming della sessione con l'interfaccia utente del portale AppStream 2.0 standard, senza le opzioni di incorporamento.

  • Le sessioni simultanee non sono supportate quando i domini personalizzati vengono utilizzati per le sessioni di streaming incorporate di AppStream 2.0. Sessioni simultanee si verificano quando gli utenti avviano due sessioni di streaming incorporate di AppStream 2.0 nella stessa pagina Web o in due diverse schede del browser. Non puoi avere un singolo utente con sessioni simultanee, ma puoi avere più utenti. Ad esempio, un utente accede all'app, quest'ultima genera un URL di streaming da fornire al cliente (che conta come utente unico per la fatturazione), un cliente carica l'URL di streaming e il cliente viene assegnato a un'istanza appstream all'interno del pool specificato.

Fase 1: specificare un dominio host per le sessioni di streaming incorporate di AppStream 2.0

Per incorporare una sessione di streaming di AppStream 2.0 in una pagina Web, aggiorna innanzitutto lo stack per specificare il dominio in cui ospitare la sessione di streaming incorporata. Si tratta di una misura di sicurezza per garantire che solo i domini di siti Web autorizzati possano incorporare sessioni di streaming di AppStream 2.0. AppStream 2.0 aggiunge il dominio o i domini specificati all'intestazione Content-Security-Policy (CSP). Per ulteriori informazioni, consulta Content Security Policy (CSP) nella documentazione MDN Web Docs di Mozilla.

Per aggiornare lo stack per specificare il dominio in cui ospitare la sessione di streaming incorporata, utilizzare uno dei seguenti metodi:

  • La console AppStream 2.0

  • L'operazione API EmbedHostDomains

  • Il comando embed-host-domains dell'interfaccia della linea di comando AWS (AWS CLI)

Per specificare un dominio host utilizzando la console AppStream 2.0, esegui la seguente procedura.

  1. Apri la console AppStream 2.0 all'indirizzo https://console.aws.amazon.com/appstream2.

  2. Nel riquadro di navigazione a sinistra scegliere Stacks (Stack) e selezionare lo stack desiderato.

  3. Scegliere Modifica.

  4. Espandi Incorpora AppStream 2.0 (facoltativo).

  5. In Host Domains (Domini host), specificare un dominio valido. Ad esempio: training.example.com.

    Nota

    Le sessioni di streaming incorporate sono supportate solo su HTTPS [porta TCP 443].

  6. Scegli Aggiorna.

Fase 2: creare un URL di streaming per l'autenticazione utente

Devi creare un URL di streaming per autenticare gli utenti per le sessioni di streaming incorporate di AppStream 2.0. SAML 2.0 e i pool di utenti non sono attualmente supportati per le sessioni di streaming incorporate. Per creare un URL di streaming, utilizza uno dei seguenti metodi:

Requisiti di configurazione per l'utilizzo di domini personalizzati

Sia che utilizzi domini personalizzati per applicare il branding aziendale o per garantire che le sessioni di streaming incorporate di AppStream 2.0 funzionino con i browser che bloccano i cookie di terze parti, i requisiti di configurazione sono gli stessi.

I domini personalizzati sono necessari se gli utenti dispongono di browser Web che bloccano i cookie di terze parti. AppStream 2.0 utilizza i cookie del browser per autenticare le sessioni di streaming e consente agli utenti di riconnettersi a una sessione attiva senza che venga richiesto di fornire ogni volta le proprie credenziali di accesso. Per impostazione predefinita, gli URL di streaming di AppStream 2.0 includono appstream.com come dominio. Quando si incorpora una sessione di streaming all'interno del sito Web, appstream.com viene trattato come un dominio di terze parti. Di conseguenza, le sessioni di streaming potrebbero essere bloccate quando vengono utilizzati browser moderni che bloccano i cookie di terze parti per impostazione predefinita.

Per evitare che le sessioni di streaming incorporate di AppStream 2.0 vengano bloccate in questo scenario, effettua la procedura riportata di seguito:

  1. Specifica un dominio personalizzato per ospitare le sessioni di streaming incorporate di AppStream 2.0.

    Quando configuri il dominio personalizzato, assicurati che il dominio sia un sottodominio della pagina Web in cui prevedi di incorporare AppStream 2.0. Ad esempio, se si aggiorna lo stack per specificare training.example.com come dominio host, è possibile creare un sottodominio chiamato content.training.example.com per le sessioni di streaming incorporate.

  2. Crea un URL di streaming per le sessioni di streaming incorporate di AppStream 2.0 che utilizza lo stesso sottodominio personalizzato. Per creare l'URL di streaming, utilizza l'operazione API CreateStreamingURL o il comando dell'interfaccia della linea di comando dell'AWS CLI create-streaming-url. Non puoi utilizzare la console AppStream 2.0 per creare un URL di streaming in questo scenario.

    Per creare un URL di streaming per le sessioni di streaming incorporate di AppStream 2.0, nell'URL sostituisci appstream2.region.aws.amazon.com con il tuo dominio.

    Per impostazione predefinita, gli URL di streaming di AppStream 2.0 sono formattati come segue:

    https://appstream2.region.aws.amazon.com/authenticate?parameters=authenticationcode

    Se il sottodominio è content.training.example.com, il nuovo URL di streaming ha questo formato:

    https://content.training.example.com/authenticate?parameters=authenticationcode
    Nota

    Quando crei un dominio personalizzato, puoi usare il dominio per le sessioni di streaming incorporate di AppStream 2.0 solo nella regione AWS per la quale è stato configurato. Se si prevede di supportare domini personalizzati in più regioni, creare un dominio personalizzato per ogni regione applicabile. Inoltre, le sessioni di streaming incorporate sono supportate solo su HTTPS [porta TCP 443].

  3. Aggiungere appstream-custom-url-domain all'intestazione della pagina Web che ospiterà le sessioni di streaming incorporate. Per il valore dell'intestazione, utilizzare il dominio visualizzato dal proxy inverso agli utenti. Ad esempio:

    Header name: appstream-custom-url-domain Header value: training.example.com

    L'impostazione di un dominio personalizzato e la creazione di un URL di streaming che specifica lo stesso dominio consente di salvare i cookie come cookie di prima parte. Per informazioni su come configurare domini personalizzati utilizzando Amazon CloudFront, consulta Utilizzo di domini personalizzati con AppStream 2.0.

Dopo aver configurato un dominio personalizzato per le sessioni di streaming incorporate di AppStream 2.0, se gli URL di streaming non reindirizzano al dominio personalizzato o se il dominio personalizzato non viene visualizzato correttamente dagli utenti, consulta i seguenti argomenti per la risoluzione dei problemi:

Fase 3: Download dei file incorporati di AppStream 2.0

Per ospitare sessioni di streaming incorporate di AppStream 2.0, devi scaricare e configurare il file JavaScript dell'API AppStream 2.0 fornito.

  1. Nella pagina Web Incorporamento di AppStream 2.0 nel sito Web, scegli il link della fase 1 per scaricare il file .zip Embed Kit di AppStream 2.0, appstream_embed_<versione>.zip.

  2. Accedere al percorso in cui è stato scaricato il file.zip ed estrarre il contenuto del file.

  3. Il contenuto estratto del file comprende una cartella, appstream-embed. Oltre ai file COPYRIGHT.txt e THIRD_PARTY_NOTICES.txt, questa cartella contiene i due file seguenti:

    • appstream-embed.js: fornisce l'API AppStream 2.0 incorporata. Questo file JavaScript include le funzioni e le operazioni API per configurare e controllare la sessione di streaming incorporata di AppStream 2.0.

    • embed-sample.html: descrive come utilizzare l'API AppStream 2.0 incorporata per inizializzare una sessione di streaming, chiamare funzioni e ascoltare eventi. Questo file di esempio espande le informazioni contenute in questo argomento per fornire un esempio di caso d'uso per gli sviluppatori.

Fase 4. Configurazione del sito Web per l'integrazione con AppStream 2.0

Nelle sezioni seguenti vengono fornite informazioni su come configurare la pagina Web per ospitare sessioni di streaming incorporate di AppStream 2.0.

Importare il file JavaScript appstream-embed

  1. Nella pagina Web in cui prevedi di incorporare la sessione di streaming AppStream 2.0, importa il file appstream-embed.js nella pagina Web aggiungendo il codice seguente:

    <script type="text/javascript" src="./appstream_embed.js"> </script>
  2. Quindi, crea un div container vuoto. L'ID del div che hai impostato viene passato nel costruttore incorporato di AppStream 2.0. Viene quindi utilizzato per inserire un iframe per la sessione di streaming. Per creare il div, aggiungere il seguente codice:

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

Inizializzare e configurare l'oggetto di interfaccia AppStream.Embed

Per inizializzare l'oggetto di interfaccia AppStream.Embed in JavaScript, è necessario aggiungere codice che crea un oggetto AppStream.Embed con opzioni per l'URL di streaming e la configurazione dell'interfaccia utente. Queste opzioni e l'ID div creato vengono memorizzati in un oggetto chiamato appstreamOptions.

Il codice di esempio seguente mostra come inizializzare l'oggetto di interfaccia 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);

Nel codice, sostituisci sessionURL e userInterfaceConfig con i tuoi valori.

Nota

Il valore specificato per userInterfaceConfig nasconde l'intera barra degli strumenti di AppStream 2.0. Questo valore, incluso come esempio, è facoltativo.

sessionUrl

L'URL di streaming creato utilizzando la console AppStream 2.0, l'operazione API CreateStreamingURL o il comando dell'AWS CLI create-streaming-url. Questo parametro prevede la distinzione tra maiuscole e minuscole.

Tipo: stringa

Required: Yes

userInterfaceConfig

La configurazione che genera lo stato iniziale degli elementi dell'interfaccia utente. La configurazione è una coppia chiave-valore.

La chiave, AppStream.Embed.Options.HIDDEN_ELEMENTS, specifica gli oggetti dell'interfaccia utente inizialmente nascosti quando viene inizializzata la sessione di streaming incorporata di AppStream 2.0. Successivamente, è possibile restituire oggetti nascosti e visibili utilizzando il parametro getInterfaceState.

Il valore è un array di costanti (pulsanti della barra degli strumenti). Per un elenco di costanti che è possibile utilizzare, consulta Utilizzo di HIDDEN_ELEMENTS.

Tipo: mappa (key:value)

Required: No

Esempi per nascondere gli elementi nell'interfaccia utente di AppStream 2.0

Negli esempi in questa sezione viene illustrato come nascondere gli elementi nell'interfaccia utente di AppStream 2.0 agli utenti durante le sessioni di streaming incorporate di AppStream 2.0.

Esempio 1: nascondere l'intera barra degli strumenti di AppStream 2.0

Per impedire agli utenti di accedere a un qualsiasi pulsante sulla barra degli strumenti di AppStream 2.0 durante le sessioni di streaming incorporate, utilizza la costante AppStream.Embed.Elements.TOOLBAR. Questa costante consente di nascondere tutti i pulsanti della barra degli strumenti di 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]} };

Esempio 2: nascondere un pulsante specifico sulla barra degli strumenti di AppStream 2.0

Puoi visualizzare la barra degli strumenti di AppStream 2.0, impedendo agli utenti di accedere a uno specifico pulsante della barra degli strumenti durante le sessioni di streaming incorporate. A tale scopo, specifica la costante del pulsante da nascondere. Il codice seguente utilizza la costante AppStream.Embed.Elements.FILES_BUTTON per nascondere il pulsante My Files (File). Ciò impedisce agli utenti di accedere alle opzioni di storage persistente durante le sessioni di streaming incorporate.

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

Esempio 3: nascondere più pulsanti sulla barra degli strumenti di AppStream 2.0

Puoi visualizzare la barra degli strumenti di AppStream 2.0, impedendo agli utenti di accedere a più di un pulsante durante le sessioni di streaming incorporate. A tale scopo, specifica le costanti dei pulsanti da nascondere. Il codice seguente utilizza le costanti AppStream.Embed.Elements.END_SESSION_BUTTON e AppStream.Embed.Elements.FULLSCREEN_BUTTON per nascondere i pulsanti End Session (Termina sessione) e Fullscreen (Schermo intero).

Nota

Separa ogni costante con una virgola, senza spazio precedente o successivo.

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]} };

Costanti, funzioni ed eventi per sessioni di streaming incorporate di AppStream 2.0

Negli argomenti seguenti vengono fornite informazioni di riferimento per costanti, funzioni ed eventi che puoi utilizzare per configurare sessioni di streaming incorporate di AppStream 2.0.

Quando viene inizializzata una sessione di streaming incorporata di AppStream 2.0, i seguenti elementi dell'interfaccia utente di AppStream 2.0 possono passare all'opzione di configurazione HIDDEN_ELEMENTS.

Utilizzo di HIDDEN_ELEMENTS

Quando viene inizializzata una sessione di streaming incorporata di AppStream 2.0, i seguenti elementi dell'interfaccia utente di AppStream 2.0 possono passare come costanti all'opzione di configurazione HIDDEN_ELEMENTS.

AppStream.Embed.Elements.TOOLBAR AppStream.Embed.Elements.FULLSCREEN_BUTTON AppStream.Embed.Elements.END_SESSION_BUTTON AppStream.Embed.Elements.TOOLBAR AppStream.Embed.Elements.CATALOG_BUTTON AppStream.Embed.Elements.WINDOW_SWITCHER_BUTTON AppStream.Embed.Elements.FILES_BUTTON AppStream.Embed.Elements.CLIPBOARD_BUTTON AppStream.Embed.Elements.COPY_LOCAL_BUTTON AppStream.Embed.Elements.PASTE_REMOTE_BUTTON AppStream.Embed.Elements.SETTINGS_BUTTON AppStream.Embed.Elements.STREAMING_MODE_BUTTON AppStream.Embed.Elements.SCREEN_RESOLUTION_BUTTON AppStream.Embed.Elements.REGIONAL_SETTINGS_BUTTON AppStream.Embed.Elements.FULLSCREEN_BUTTON AppStream.Embed.Elements.END_SESSION_BUTTON

I seguenti tre elementi possono essere passati come stringhe in HIDDEN_ELEMENTS, piuttosto che come costanti.

Stringa Descrizione
'adminCommandsButton' Quando sei collegato a un Image Builder di AppStream 2.0, il pulsante Comandi di amministrazione viene visualizzato nell'angolo in alto a destra della barra degli strumenti della sessione di AppStream 2.0. Passando questa stringa in HIDDEN_ELEMENTS nasconde il pulsante Comandi di amministrazione.
'softKeyboardButton' Durante le sessioni di streaming di AppStream 2.0 su dispositivi sensibili al tocco, gli utenti possono toccare l'icona della tastiera sulla barra degli strumenti di AppStream 2.0 per visualizzare la tastiera su schermo. Passando questa stringa in HIDDEN_ELEMENTS nasconde l'icona della tastiera.
'keyboardShortcutsButton' Durante le sessioni di streaming di AppStream 2.0 su dispositivi sensibili al tocco, gli utenti possono toccare l'icona Fn sulla barra degli strumenti di AppStream 2.0 per visualizzare i tasti di scelta rapida. Passando questa stringa in HIDDEN_ELEMENTS nasconde l'icona Fn.

Funzioni per l'oggetto AppStream.Embed

Nella tabella seguente sono elencate le funzioni che possono essere eseguite sull'oggetto AppStream.Embed.

Funzione Descrizione
AppStream.Embed(containerId:string, options:object) Il costruttore di oggetti AppStream.Embed. Questo costruttore inizializza e comunica con l'oggetto AppStream.Embed e utilizza un ID container div. L'ID viene utilizzato per inserire l'iframe. Inoltre inserisce un oggetto che include le opzioni di configurazione per appstreamOptions (sessionURL e HIDDEN_ELEMENTS).
endSession() Questa funzione termina la sessione di streaming, ma non distrugge l'iframe. Se si specifica un URL di reindirizzamento, l'iframe tenta di caricare l'URL. A seconda delle intestazioni CORS della pagina, l'URL potrebbe non essere caricato.
launchApp(appId:string) Questa funzione avvia a livello di codice un'applicazione con l'ID dell'applicazione specificato durante la creazione dell'immagine.
launchAppSwitcher() Questa funzione invia il comando AppSwitcher al portale di AppStream 2.0. Questo attiva il comando AppSwitcher sull'istanza.
getSessionState() Questa funzione restituisce un oggetto per sessionStatus. Per ulteriori informazioni, consulta Eventi per sessioni di streaming incorporate di AppStream 2.0.
getUserInterfaceState()

Questa funzione restituisce un oggetto per UserInterfaceState. L'oggetto contiene le coppie chiave-valore per quanto segue:

sessionStatus: enumerazione dello stato

sessionTerminationReason: Stringa

sessionDisconnectionReason: Stringa

Per ulteriori informazioni, consulta Eventi per sessioni di streaming incorporate di AppStream 2.0.

addEventListener(name, callback) Questa funzione aggiunge una funzione di callback per chiamare quando viene attivato l'evento specificato. Per un elenco degli eventi che possono essere attivati, consulta Eventi per sessioni di streaming incorporate di AppStream 2.0.
removeEventListener(name, callback) Questa funzione rimuove il callback per gli eventi specificati.
destroy() Questa funzione elimina l'iframe e pulisce le risorse. Questa funzione non influisce sulle sessioni di streaming in corso.

Eventi per sessioni di streaming incorporate di AppStream 2.0

Nella tabella seguente sono elencati gli eventi che possono essere attivati durante le sessioni di streaming incorporate di AppStream 2.0.

Evento Dati Descrizione
AppStream.Embed.Events.SESSION_STATE_CHANGE

sessionStatus: State enumeration

sessionTerminationReason: Stringa

sessionDisconnectionReason: Stringa

Questo evento viene attivato quando si verifica una modifica dello stato della sessione. L'evento include una mappa degli stati modificati. Per recuperare lo stato della sessione completa, utilizzare la funzione getSessionState().

Di seguito sono riportati gli stati di sessione:

AppStream.Embed.SessionStatus.Unknown: la sessione non è iniziata e non è riservata

AppStream.Embed.SessionStatus.Reserved: la sessione è riservata ma non è iniziata.

AppStream.Embed.SessionStatus.Started: l'utente si è collegato alla sessione e ha avviato lo streaming.

AppStream.Embed.SessionStatus Disconnected : l'utente si è disconnesso dalla sessione.

AppStream.Embed.SessionStatus.Ended: la sessione è stata contrassegnata come terminata o scaduta.

AppStream.Embed.Events.SESSION_INTERFACE_STATE_CHANGE

hiddenElements: array di stringhe

isFullscreen: Booleano

isSoftKeyboardVisible: Booleano

Questo evento viene attivato quando si verifica una modifica dello stato della sessione. L'evento include una mappa degli stati modificati. Per recuperare lo stato della sessione completa, utilizzare la funzione getSessionState().
AppStream.Embed.Events.SESSION_ERROR

errorCode: numero

errorMessage: Stringa

Questo evento viene attivato quando si verificano errori durante una sessione.

Esempi per l'aggiunta di listener di eventi e la conclusione di una sessione di streaming incorporata di AppStream 2.0

Gli esempi in questa sezione mostrano come eseguire le operazioni seguenti:

  • Aggiunta di listener di eventi per le sessioni di streaming incorporate di AppStream 2.0.

  • Terminare a livello di programmazione una sessione di streaming incorporata di AppStream 2.0.

Esempio 1: aggiunta di listener di eventi per le sessioni di streaming incorporate di AppStream 2.0

Per aggiungere listener di eventi per le modifiche dello stato della sessione, le modifiche dello stato dell'interfaccia della sessione e gli errori di sessione durante le sessioni di streaming incorporate, utilizzare il codice seguente:

appstreamEmbed.addEventListener(AppStream.Embed.Events.SESSION_STATE_CHANGE, updateSessionStateCallback); appstreamEmbed.addEventListener(AppStream.Embed.Events.SESSION_INTERFACE_STATE_CHANGE, updateUserInterfaceStateCallback); appstreamEmbed.addEventListener(AppStream.Embed.Events.SESSION_ERROR, errorCallback);

In questo esempio, AppStream.Embed.Events.SESSION_STATE_CHANGE, AppStream.Embed.Events.SESSION_INTERFACE_STATE_CHANGE e AppStream.Embed.Events.SESSION_ERROR sono nomi di eventi.

Le funzioni updateSessionStateCallback, updateUserInterfaceStateCallback e errorCallback sono quelle implementate. Queste funzioni passano nella funzione addEventListener e chiamate quando viene attivato un evento.

Esempio 2: terminare a livello di programmazione una sessione di streaming incorporata di AppStream 2.0

Per terminare una sessione di streaming incorporata di AppStream 2.0, usa la seguente funzione:

appstreamEmbed.endSession();