Las traducciones son generadas a través de traducción automática. En caso de conflicto entre la traducción y la version original de inglés, prevalecerá la version en inglés.

# Paso 4. Configure su sitio web para la integración con Amazon WorkSpaces Applications
<a name="configure-website-for-integration"></a>

En las siguientes secciones se proporciona información sobre cómo configurar su página web para alojar sesiones de streaming de WorkSpaces aplicaciones integradas.

**Topics**
+ [Importar el archivo appstream-embed JavaScript](#import-embed-javascript-file)
+ [Inicializar y configurar el objeto de interfaz `AppStream.Embed`](#initialize-configure-embed-interface-object)
+ [Ejemplos de ocultación de elementos en la interfaz de usuario de la WorkSpaces aplicación](#examples-hiding-user-interface-items)

## Importar el archivo appstream-embed JavaScript
<a name="import-embed-javascript-file"></a>

1. En la página web en la que planea incrustar la sesión de streaming de WorkSpaces Applications, importe el archivo **appstream-embed.js** a la página web añadiendo el siguiente código:

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

1. A continuación, cree un contenedor div vacío. El ID del div que defina se pasa al constructor de incrustación de WorkSpaces aplicaciones. A continuación, se usa para inyectar un iframe para la sesión de streaming. Para crear el div, añada el siguiente código:

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

## Inicializar y configurar el objeto de interfaz `AppStream.Embed`
<a name="initialize-configure-embed-interface-object"></a>

Para inicializar el objeto de `AppStream.Embed` interfaz JavaScript, debe agregar código que cree un `AppStream.Embed` objeto con opciones para la configuración de la URL de transmisión y la interfaz de usuario. Estas opciones, así como el ID div que ha creado, se almacenan en un objeto denominado `appstreamOptions`.

El código de ejemplo siguiente muestra cómo inicializar el objeto de interfaz `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);
```

En el código, sustituya *sessionURL* y *userInterfaceConfig* por sus propios valores. 

**nota**  
El valor especificado para *userInterfaceConfig* oculta toda la barra de herramientas de WorkSpaces aplicaciones. Este valor, que se incluye como ejemplo, es opcional.

***sessionUrl***  
La URL de transmisión que creó mediante la consola de WorkSpaces aplicaciones, la acción de la API [CreateStreamingURL](https://docs.aws.amazon.com/appstream2/latest/APIReference/API_CreateStreamingURL.html) o el comando [create-streaming-url](https://docs.aws.amazon.com/cli/latest/reference/appstream/create-streaming-url.html) AWS CLI. Este parámetro distingue entre mayúsculas y minúsculas.  
**Tipo:** cadena  
**Obligatorio**: sí

***userInterfaceConfig***  
La configuración que genera el estado inicial de los elementos de la interfaz de usuario. La configuración es un par de clave-valor.   
La clave,`AppStream.Embed.Options.HIDDEN_ELEMENTS`, especifica los objetos de la interfaz de usuario que se ocultan inicialmente cuando se inicializa la sesión de streaming de WorkSpaces las aplicaciones integradas. Posteriormente, puede devolver tanto objetos ocultos como visibles mediante el parámetro `getInterfaceState`.  
El valor es una matriz de constantes (botones de la barra de herramientas). Para obtener una lista de constantes que puede utilizar, consulte [Uso de `HIDDEN_ELEMENTS`](constants-functions-events-embedded-sessions.md#constants-hidden-elements).  
**Tipo**: Mapa (*key*:*value*)  
**Obligatorio**: no

## Ejemplos de ocultación de elementos en la interfaz de usuario de la WorkSpaces aplicación
<a name="examples-hiding-user-interface-items"></a>

Los ejemplos de esta sección muestran cómo ocultar a los usuarios los elementos de la interfaz de usuario de WorkSpaces las aplicaciones durante las sesiones de streaming de WorkSpaces las aplicaciones integradas.

**Topics**
+ [Ejemplo 1: Ocultar toda la barra de herramientas de WorkSpaces aplicaciones](#example-hide-the-entire-tooolbar)
+ [Ejemplo 2: Ocultar un botón específico en la barra de herramientas de WorkSpaces aplicaciones](#example-hide-a-specific-toolbar-button)
+ [Ejemplo 3: Ocultar varios botones de la barra de herramientas de WorkSpaces aplicaciones](#example-hide-multiple-toolbar-buttons)

### Ejemplo 1: Ocultar toda la barra de herramientas de WorkSpaces aplicaciones
<a name="example-hide-the-entire-tooolbar"></a>

Para evitar que los usuarios accedan a cualquier botón de la barra de herramientas de WorkSpaces aplicaciones durante las sesiones de streaming integradas, utilice la `AppStream.Embed.Elements.TOOLBAR` constante. Esta constante permite ocultar todos los botones de la barra de herramientas de WorkSpaces aplicaciones.

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

### Ejemplo 2: Ocultar un botón específico en la barra de herramientas de WorkSpaces aplicaciones
<a name="example-hide-a-specific-toolbar-button"></a>

Puede mostrar la barra de herramientas de WorkSpaces aplicaciones y, al mismo tiempo, impedir que los usuarios accedan a un botón específico de la barra de herramientas durante las sesiones de streaming integradas. Para ello, especifique la constante del botón que desea ocultar. El código siguiente utiliza la constante `AppStream.Embed.Elements.FILES_BUTTON` para ocultar el botón **My Files (Mis archivos)**. Esto impide que los usuarios accedan a las opciones de almacenamiento persistente durante las sesiones de streaming integradas.

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

### Ejemplo 3: Ocultar varios botones de la barra de herramientas de WorkSpaces aplicaciones
<a name="example-hide-multiple-toolbar-buttons"></a>

Puede mostrar la barra de herramientas de WorkSpaces aplicaciones y, al mismo tiempo, impedir que los usuarios accedan a más de un botón de la barra de herramientas durante las sesiones de streaming integradas. Para ello, especifique las constantes de los botones que desea ocultar. El código siguiente utiliza las constantes `AppStream.Embed.Elements.END_SESSION_BUTTON` y `AppStream.Embed.Elements.FULLSCREEN_BUTTON` para ocultar los botones **Finalizar sesión** y **Pantalla completa**. 

**nota**  
Separe las constantes entre sí mediante comas, sin espacio anterior ni posterior.

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