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.
# Tutorial: Cómo configurar una aplicación web básica de Transfer Family
Este tutorial explica cómo configurar una aplicación web Transfer Family. Las aplicaciones web Transfer Family ofrecen una interfaz sencilla para transferir datos desde y hacia Amazon S3 a través de un navegador web. Para obtener documentación detallada sobre esta función, consulte[Aplicaciones web Transfer Family](web-app.md).
## Tutorial sobre la aplicación web: requisitos previos
+ Cree una instancia de cuenta o una instancia de organización de AWS IAM Identity Center. Para obtener más información, consulte [Configura tu proveedor de identidad para las aplicaciones web Transfer Family](webapp-identity-center.md).
Si no utiliza el Centro de Identidad de IAM como proveedor de identidad, se [Integre Okta como su proveedor de identidad para las aplicaciones web](#web-tutorial-okta) muestra cómo utilizar un proveedor de identidad alternativo (en este caso Okta).
+ Necesitas un bucket de Amazon S3 para interactuar con tu aplicación web Transfer Family. Para obtener más información, consulte [Configurar un bucket de Amazon S3](configure-storage.md#requirements-S3)
**nota**
En este tutorial se asume que está utilizando el directorio del Centro de Identidad de IAM como proveedor de identidad. Si no es así, consulte [Configura tu proveedor de identidad para las aplicaciones web Transfer Family](webapp-identity-center.md) antes de continuar con este tutorial.
Tras completar el tutorial, el usuario podrá iniciar sesión e interactuar con la aplicación web que cree.
## Paso 1: Cree los recursos de apoyo necesarios
Debe añadir un usuario al directorio del centro de identidad de IAM. También necesita dos funciones: una para usarla como función de portador de identidad para su aplicación web y otra para configurar una concesión de acceso a Amazon S3. En el tutorial, permitimos que AWS los servicios creen estos roles por nosotros.
**Para añadir un usuario**
1. Inicie sesión en Consola de administración de AWS y abra la AWS IAM Identity Center consola en [https://console.aws.amazon.com/singlesignon/](https://console.aws.amazon.com/singlesignon/).
1. En el panel de navegación izquierdo, selecciona **Usuarios**.
1. Elija **Añadir usuario** y especifique los detalles del usuario.
Especifique un nombre de usuario, una dirección de correo electrónico y otra información necesaria. Puedes elegir entre enviar un correo electrónico al usuario con instrucciones para configurar su contraseña o puedes generar una contraseña de un solo uso para compartirla con él.
1. Selecciona **Siguiente** y, si lo deseas, asigna el nuevo usuario a uno o más grupos.
1. Seleccione **Siguiente** y revise sus opciones.
Si todo va bien, elija **Añadir usuario** para crear el nuevo usuario con los detalles que especificó.
**Para el tutorial, el usuario de ejemplo es **Bob Stiles, con el nombre de usuario **bobstiles**** y la dirección de correo electrónico bobstiles@example.com.**
## Paso 2: Crear una aplicación web Transfer Family
**Para crear una aplicación web Transfer Family**
1. Inicia sesión en Consola de administración de AWS y abre la AWS Transfer Family consola en [https://console.aws.amazon.com/transfer/](https://console.aws.amazon.com/transfer/).
1. En el panel de navegación izquierdo, selecciona **Aplicaciones web**.
1. Seleccione **Crear aplicación web**.
Para el acceso de autenticación, ten en cuenta que el servicio busca automáticamente la AWS IAM Identity Center instancia que configuraste como requisito previo.
1. En el panel **de tipos de permisos**, selecciona **Crear y usar un nuevo rol de servicio**. El servicio crea el rol de portador de identidad para usted. Un rol de portador de identidad incluye la identidad de un usuario autenticado en sus sesiones.
1. En el panel de **unidades de aplicaciones web**, acepte el valor predeterminado de 1 o ajústelo a un valor superior si es necesario.
1. Agregue una etiqueta que le ayude a organizar sus aplicaciones web. Para el tutorial, introduzca el **nombre** de la clave y la **aplicación web Tutorial** para el valor.
**sugerencia**
Puede editar el nombre de la aplicación web directamente desde la página de la lista de **aplicaciones web** después de crearla.
1. Seleccione **Siguiente** para abrir la página **Diseño de la aplicación web**. En esta pantalla, proporcione la siguiente información.
Si lo desea, puede proporcionar un título para su aplicación web. También puede cargar archivos de imagen para su logotipo y su favicon.
+ Para el título de la página, personalice el título de la pestaña del navegador que ven los usuarios cuando se conectan a la aplicación web. Si no escribes nada para el título de la página, el valor predeterminado es **Transfer Web App**.
+ Para el logotipo, sube un archivo de imagen. El tamaño máximo de archivo para la imagen del logotipo es de 50 KB.
+ Para el favicon, sube un archivo de imagen. El tamaño máximo de archivo para tu favicon es de 20 KB.
1. Selecciona **Siguiente** y, a continuación, selecciona **Crear aplicación web**.
Para ofrecer una experiencia de marca, puedes proporcionar una URL personalizada para que tus usuarios accedan a tu aplicación web Transfer Family. Para obtener más información, consulte [Actualice su terminal de acceso con una URL personalizada](webapp-customize.md).
## Paso 3: Configura el intercambio de recursos entre orígenes (CORS) para tu bucket
Debes configurar el intercambio de recursos entre orígenes (CORS) para todos los depósitos que utilice tu aplicación web. Una *configuración de CORS* es un documento que define las reglas que identifican los orígenes a los que permitirá acceder a su depósito. Para obtener más información sobre CORS, consulte [Configuración del uso compartido de recursos entre orígenes (](https://docs.aws.amazon.com/AmazonS3/latest/userguide/enabling-cors-examples.html?icmpid=docs_amazons3_console)CORS).
**Para configurar el uso compartido de recursos entre orígenes (CORS) para su bucket de Amazon S3**
1. Inicie sesión en la consola de Amazon S3 Consola de administración de AWS y ábrala en [https://console.aws.amazon.com/s3/](https://console.aws.amazon.com/s3/).
1. Selecciona **Buckets** en el panel de navegación izquierdo y busca tu bucket en el cuadro de diálogo de búsqueda y, a continuación, selecciona la pestaña **Permisos**.
1. En el **uso compartido de recursos entre orígenes (CORS)**, selecciona **Editar** y pega el siguiente código. *AccessEndpoint*Sustitúyalo por el punto de acceso real de tu aplicación web. Asegúrese de no introducir barras diagonales finales, ya que al hacerlo se producirán errores cuando los usuarios intenten iniciar sesión en su aplicación web.
+ Ejemplo incorrecto: `https://webapp-c7bf3423.transfer-webapp.us-east-2.on.aws/`
+ Ejemplo correcto: `https://webapp-c7bf3423.transfer-webapp.us-east-2.on.aws`
Si va a reutilizar un depósito para varias aplicaciones web, añada sus puntos finales de acceso a las aplicaciones web a la lista. `AllowedOrigins`
```
[
{
"AllowedHeaders": [
"*"
],
"AllowedMethods": [
"GET",
"PUT",
"POST",
"DELETE",
"HEAD"
],
"AllowedOrigins": [
"https://AccessEndpoint"
],
"ExposeHeaders": [
"last-modified",
"content-length",
"etag",
"x-amz-version-id",
"content-type",
"x-amz-request-id",
"x-amz-id-2",
"date",
"x-amz-cf-id",
"x-amz-storage-class",
"access-control-expose-headers"
],
"MaxAgeSeconds": 3000
}
]
```
1. Seleccione **Guardar cambios** para actualizar el CORS.
## Paso 4: Agrega un usuario a tu aplicación web Transfer Family
Añada el usuario que creó anteriormente en el Centro de identidades de IAM.
**Para asignar usuarios a una aplicación web Transfer Family**
1. Navega hasta la aplicación web que creaste anteriormente.
1. Elija **Asignar usuarios y grupos**.
![\[Pantalla que muestra los detalles de una aplicación web seleccionada.\]](http://docs.aws.amazon.com/es_es/transfer/latest/userguide/images/webapp-transfer-details.png)
1. Para asignar el usuario que creó anteriormente en el Centro de identidades de IAM, seleccione **Asignar usuarios y grupos existentes y**, a continuación, seleccione **Siguiente**.
1. Busque el usuario por el nombre para mostrar. Tenga en cuenta que no aparece ningún usuario hasta que comience a introducir los criterios de búsqueda. Para añadir**Bob Stiles**, escribe **bob** en el cuadro de búsqueda. Si no encuentra a su usuario, vaya a la consola de administración del IAM Identity Center, busque al usuario y, a continuación, copie y pegue aquí su nombre para mostrar.
1. Elija el **Bob Stiles** usuario y, a continuación, seleccione **Asignar**.
## Paso 5: Registrar una ubicación en Amazon S3 y crear una concesión de acceso
Después de asignar un usuario a su aplicación web, debe registrar un bucket y crear una concesión de acceso para ese usuario.
**nota**
Debe tener una instancia de S3 Access Grants para poder continuar. Para obtener más información, consulte [Crear una instancia de S3 Access Grants](https://docs.aws.amazon.com/AmazonS3/latest/userguide/access-grants-instance-create.html) en la *Guía del usuario de Amazon Simple Storage Service*.
**Para registrar una ubicación y crear una concesión de acceso**
1. Inicie sesión en la consola de Amazon S3 Consola de administración de AWS y ábrala en [https://console.aws.amazon.com/s3/](https://console.aws.amazon.com/s3/).
1. Seleccione **Access Grants** en el panel de navegación izquierdo.
1. Seleccione **Ver detalles** para ver los detalles de su instancia de S3 Access Grants.
1. Seleccione la pestaña **Ubicaciones** y, a continuación, elija **Registrar ubicación**.
1. Proporcione la siguiente información.
+ Para el **ámbito**, busca un depósito o introduce el nombre del depósito y, si lo prefieres, un prefijo. Tenga en cuenta que el ámbito comienza con la cadena**s3://**.
+ Para el rol de IAM, elija **Crear nuevo rol** para que Amazon S3 cree un rol. Este rol permite a S3 Access Grants acceder al ámbito de ubicación especificado.
![\[Pantalla que muestra el cuadro de diálogo Registrar buckets o prefijos de S3 como ubicaciones de Amazon S3 con los ajustes predeterminados de Alcance y Crear nuevos roles.\]](http://docs.aws.amazon.com/es_es/transfer/latest/userguide/images/webapp-grants-register-new.png)
Seleccione **Registrar ubicación** para continuar.
1. Seleccione la pestaña **Subvenciones**, luego elija **Crear subvención** y proporcione los siguientes detalles.
+ En **Ubicación**, selecciona **Buscar ubicaciones** y elige la ubicación que registraste en el paso anterior.
+ En **Subprefijo, introdúzcalo** **\$1** para indicar que la concesión de acceso se aplica a todo el depósito.
+ **Para **los permisos**, seleccione **Leer y escribir**.**
+ Para el **tipo de concesionario**, elija la identidad del **directorio en el Centro de identidades de IAM.**
+ **En el **tipo de identidad del directorio, seleccione** Usuario.**
+ En el **usuario/ID del IAM Identity Center**, copie y pegue el ID de usuario de. **Bob Stiles** Este ID está disponible en el panel **Usuarios** de la aplicación web Transfer Family.
1. Selecciona **Crear subvención**.
Se crea la concesión de acceso.
## Paso 6: Acceda a su aplicación web Transfer Family como usuario
Ahora, navegamos hasta la URL de la aplicación web e iniciamos sesión como el usuario que asignamos anteriormente.
**Para iniciar sesión en la aplicación web Transfer Family**
1. Navega hasta tu aplicación web
1. Elija el **punto final de acceso** en el panel de **detalles de la aplicación web**.
![\[Pantalla que muestra los detalles de la aplicación web creada durante el tutorial.\]](http://docs.aws.amazon.com/es_es/transfer/latest/userguide/images/webapp-transfer-tutorial-enduser.png)
1. En la pantalla de inicio de sesión, introduce el usuario que has creado y**bobstiles**, a continuación, selecciona **Siguiente**.
1. Introduzca la contraseña que el sistema asignó a este usuario al crearlo y seleccione **Siguiente**.
1. Si su organización requiere la autenticación multifactor (MFA), debe configurarla ahora. Si no es así, vaya al paso 6.
1. Aparecerá una pantalla para registrar su dispositivo MFA. Elija una de las opciones disponibles y seleccione **Siguiente**.
1. Realice los pasos necesarios para configurar el MFA para este usuario: los pasos dependen de la opción de MFA que elija.
1. Puede que tenga que establecer una nueva contraseña para su usuario; si es necesario, hágalo ahora. Es posible que el sistema también requiera que vuelva a iniciar sesión con las nuevas credenciales de MFA que configuró.
Su usuario debería ver una pantalla similar a la siguiente. Ten en cuenta que esta captura de pantalla incluye la personalización del favicon y el logotipo.
![\[Un ejemplo de la aplicación web Transfer Family, con un título, un favicon y un logotipo personalizados.\]](http://docs.aws.amazon.com/es_es/transfer/latest/userguide/images/webapp-tutorial-enduser.png)
## Siguientes pasos
Has configurado correctamente una aplicación web básica de Transfer Family con acceso estándar al bucket S3. Si necesitas un control más detallado de los permisos de los buckets, por ejemplo, permitir a los usuarios descargar de un bucket y subirlos a otro, consulta[Tutorial: Configuración de una aplicación AWS Transfer Family web con acceso selectivo a varios cubos](webapp-s3-tutorial.md).
## Integre Okta como su proveedor de identidad para las aplicaciones web
Puedes integrar un proveedor de identidad externo con las aplicaciones web Transfer Family. En esta sección, se describe cómo configurar Okta como tu proveedor de identidad.
1. En Okta, crea un usuario, un grupo y una aplicación. Para obtener más información sobre cómo hacerlo, consulte [Configurar SAML y SCIM con Okta e](https://docs.aws.amazon.com/singlesignon/latest/userguide/gs-okta.html) IAM Identity Center.
![\[Un ejemplo de aplicación Okta para usar con la aplicación web Transfer Family (tutorial)\]](http://docs.aws.amazon.com/es_es/transfer/latest/userguide/images/webapp-tutorial-okta.png)
1. Conecta Okta e importa el usuario y el grupo de Okta a. AWS IAM Identity Center Siga los pasos 1 a 4 de [Configurar SAML y SCIM con Okta e IAM Identity Center](https://docs.aws.amazon.com/singlesignon/latest/userguide/gs-okta.html).
![\[El centro de identidad de IAM muestra un ejemplo de usuario integrado desde Okta\]](http://docs.aws.amazon.com/es_es/transfer/latest/userguide/images/webapp-tutorial-okta-ic-user.png)
![\[El centro de identidad de IAM muestra un ejemplo de grupo integrado desde Okta\]](http://docs.aws.amazon.com/es_es/transfer/latest/userguide/images/webapp-tutorial-okta-ic-group.png)
1. Confirme que la fuente de identidad del Centro de Identidad de IAM sea SAML 2.0.
![\[El centro de identidad de IAM muestra que la fuente de identidad es SAML 2.0\]](http://docs.aws.amazon.com/es_es/transfer/latest/userguide/images/webapp-tutorial-okta-confirm.png)
1. Asigne su usuario y grupo, tal y como se describe en. [Paso 4: Agrega un usuario a tu aplicación web Transfer Family](#web-tutorial-step4)
1. Para evitar que los usuarios tengan que usar MFA al iniciar sesión en su aplicación web, lleve a cabo los siguientes pasos en Okta.
1. Desde la consola de administración de Okta, accede a **[Aplicaciones] - [Aplicaciones]** y selecciona la aplicación. AWS IAM Identity Center
1. En la pestaña **Iniciar sesión**, selecciona **[Autenticación de usuario] - Editar**.
1. Selecciona **Solo contraseña**.
Después de realizar todos los demás pasos del tutorial, el usuario debería poder acceder a la aplicación web Transfer Family navegando hasta el punto de acceso de la aplicación web en un navegador web.