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: Crear una canalización que utilice Amazon S3 como proveedor de implementación En este tutorial, va a configurar una canalización que enviará constantemente archivos utilizando Amazon S3 como proveedor de acciones de implementación en la etapa de implementación. La canalización completa detecta cambios cuando se realiza un cambio en los archivos de código fuente en el repositorio de código fuente. Esto hace que la canalización utilice Amazon S3 para implementar los archivos en el bucket. Cada vez que modifique o añada los archivos del sitio web en su ubicación de origen, la implementación creará el sitio web con los archivos más recientes. **importante** Como parte de la creación de una canalización, se utilizará un depósito de artefactos de S3 proporcionado por el cliente CodePipeline para los artefactos. (Es diferente del bucket que se usa para una acción de origen de S3). Si el depósito de artefactos de S3 está en una cuenta diferente a la de tu canalización, asegúrate de que el depósito de artefactos de S3 pertenezca a una Cuentas de AWS persona segura y fiable. **nota** Incluso si elimina archivos del repositorio de origen, la acción de implementación de S3 no elimina los objetos de S3 correspondientes a los archivos eliminados. En este tutorial, encontrará dos opciones: + Puede crear una canalización que implemente un sitio web estático en un bucket público de S3. En este ejemplo, se crea una canalización con una acción de AWS CodeCommit origen y una acción de despliegue de Amazon S3. Consulte [Opción 1: Implementar los archivos de un sitio web estático en Amazon S3](#tutorials-s3deploy-acc). + Cree una canalización que compile el TypeScript código de muestra JavaScript y despliegue el artefacto de CodeBuild salida en su bucket de S3 para archivarlo. En este ejemplo, se crea una canalización con una acción de origen de Amazon S3, una acción de CodeBuild compilación y una acción de despliegue de Amazon S3. Consulte [Opción 2: Implementar archivos compilados archivados en Amazon S3 desde un bucket de origen de S3](#tutorials-s3deploy-s3source). **importante** Muchas de las acciones que añada a la canalización en este procedimiento implican AWS recursos que debe crear antes de crear la canalización. AWS Los recursos para las acciones de origen siempre deben crearse en la misma AWS región en la que se creó la canalización. Por ejemplo, si creas tu canalización en la región EE.UU. Este (Ohio), tu CodeCommit repositorio debe estar en la región EE.UU. Este (Ohio). Puedes añadir acciones entre regiones al crear tu canalización. AWS los recursos para las acciones entre regiones deben estar en la misma AWS región en la que planeas ejecutar la acción. Para obtener más información, consulte [Añadir una acción interregional en CodePipeline](actions-create-cross-region.md). ## Opción 1: Implementar los archivos de un sitio web estático en Amazon S3 En este ejemplo, descarga el archivo de plantilla de sitio web estático de ejemplo, carga los archivos en su AWS CodeCommit repositorio, crea su depósito y lo configura para el alojamiento. A continuación, utilice la AWS CodePipeline consola para crear su canalización y especificar una configuración de despliegue de Amazon S3. ### Requisitos previos Debe disponer de lo siguiente: + Un CodeCommit repositorio. Puedes usar el AWS CodeCommit repositorio en el que lo creaste[Tutorial: Crear una canalización sencilla (CodeCommit repositorio)](tutorials-simple-codecommit.md). + Archivos de código fuente del sitio web estático. Utilice este enlace para descargar un [ejemplo de sitio web estático](samples/sample-website.zip). La descarga de sample-website.zip produce los siguientes archivos: + Un archivo `index.html` + Un archivo `main.css` + Un archivo `graphic.jpg` + Un bucket de S3 configurado para alojar sitios web. Consulte [Alojamiento de un sitio web estático en Amazon S3](https://docs.aws.amazon.com/AmazonS3/latest/userguide/WebsiteHosting.html). No olvide que el bucket debe crearse en la misma región que la canalización. **nota** Para alojar un sitio web, el bucket debe tener acceso de lectura público, lo que concede acceso a todo el mundo. Salvo en el caso del alojamiento de sitios web, debe dejar la configuración de acceso predeterminada que bloquea el acceso público a los buckets de S3. ### Paso 1: Envía los archivos fuente a tu CodeCommit repositorio En esta sección, debe enviar los archivos de código fuente al repositorio que utiliza la canalización para la etapa de código fuente. **Para enviar archivos a tu CodeCommit repositorio** 1. Extraiga los archivos de ejemplo que ha descargado. No cargue el archivo ZIP en el repositorio. 1. Envía o sube los archivos a tu CodeCommit repositorio. Estos archivos son el artefacto de código fuente creado por el asistente **Create Pipeline (Crear canalización)** para la acción de implementación en CodePipeline. Sus archivos deberían ser parecidos a estos en su directorio local: ``` index.html main.css graphic.jpg ``` 1. Puedes usar Git o la CodeCommit consola para cargar tus archivos: 1. Para utilizar la línea de comandos de Git desde un repositorio clonado en el equipo local: 1. Ejecute el siguiente comando para preparar todos los archivos de una vez: ``` git add -A ``` 1. Ejecute el siguiente comando para confirmar los archivos con un mensaje de confirmación: ``` git commit -m "Added static website files" ``` 1. Ejecuta el siguiente comando para enviar los archivos de tu repositorio local a tu CodeCommit repositorio: ``` git push ``` 1. Para usar la CodeCommit consola para cargar tus archivos: 1. Abre la CodeCommit consola y elige tu repositorio en la lista de **repositorios**. 1. Elija **Add file (Añadir archivo)** y, a continuación, **Upload file (Cargar archivo)**. 1. Seleccione **Choose file (Elegir archivo)** y, a continuación, busque el archivo. Para confirmar el cambio, introduzca su nombre de usuario y la dirección de correo electrónico. Seleccione **Confirmar cambios**. 1. Repita este paso para cada archivo que desee cargar. ### Paso 2: Crear la canalización En esta sección, debe crear una canalización con las siguientes acciones: + Una etapa de origen con una CodeCommit acción en la que los artefactos de origen son los archivos de tu sitio web. + Una etapa de implementación con una acción de implementación de Amazon S3. **Para crear una canalización con el asistente** 1. Inicie sesión Consola de administración de AWS y abra la CodePipeline consola en [http://console.aws.amazon. com/codesuite/codepipeline/home](https://console.aws.amazon.com/codesuite/codepipeline/home). 1. En la página **Bienvenido**, **Introducción** o en la página **Canalizaciones**, elija **Crear canalización**. 1. En la página **Paso 1: elección de la opción de creación**, en **Opciones de creación**, seleccione la opción **Crear una canalización personalizada**. Elija **Siguiente**. 1. En **Paso 2: elegir la configuración de la canalización**, en **Nombre de la canalización**, escriba **MyS3DeployPipeline**. 1. En **Tipo de canalización**, seleccione **V2**. Para obtener más información, consulte [Tipos de canalización](pipeline-types.md). Elija **Siguiente**. 1. En **Función de servicio**, elija **Nueva función de servicio** CodePipeline para poder crear una función de servicio en IAM. 1. En **Advanced settings (Configuración avanzada)**, deje los valores predeterminados y elija **Next (Siguiente)**. 1. En **Paso 3: agregar la etapa de origen**, en **Proveedor de origen**, elija **AWS CodeCommit**. En **Repository name (Nombre de repositorio)**, elija el nombre del repositorio de CodeCommit que ha creado en [Paso 1: Crea un CodeCommit repositorio](tutorials-simple-codecommit.md#codecommit-create-repository). En **Nombre de ramificación**, elija el nombre de la ramificación que incluye la última actualización del código. A menos que haya creado otra ramificación, solo estará disponible `main`. Tras seleccionar el nombre y la sucursal del repositorio, se muestra la regla de Amazon CloudWatch Events que se va a crear para esta canalización. Elija **Siguiente**. 1. En **Paso 4: agregar la etapa de compilación**, elija **Omitir la etapa de compilación** y, a continuación, acepte el mensaje de advertencia eligiendo **Omitir** una vez más. Elija **Siguiente**. 1. En **Paso 5: agregación de la etapa de prueba**, elija **Omitir la etapa de prueba** y, a continuación, acepte el mensaje de advertencia eligiendo **Omitir** una vez más. Elija **Siguiente**. 1. En el **paso 6: Añadir la etapa de despliegue**: 1. En **Deploy provider (Proveedor de implementación)**, elija **Amazon S3**. 1. En **Bucket**, especifique el nombre del bucket público. 1. Seleccione **Extract file before deploy (Extraer el archivo antes de la implementación)**. **nota** Si no selecciona **Extraer el archivo antes de la implementación**, se produce un error en la implementación. Esto se debe a que la AWS CodeCommit acción de la canalización comprime los artefactos de origen y el archivo es un archivo ZIP. Cuando se selecciona **Extract file before deploy (Extraer el archivo antes de la implementación)**, se muestra **Deployment path (Ruta de implementación)**. Especifique el nombre de la ruta que desea utilizar. Esto crea una estructura de carpetas en Amazon S3 en la que se extraen los archivos. Para este tutorial, deje en blanco este campo. ![\[La página Paso 6: Añadir una fase de despliegue para una acción de despliegue de S3 con una fuente AWS CodeCommit\]](http://docs.aws.amazon.com/es_es/codepipeline/latest/userguide/images/tutorial-s3deploy-stage-codecommit.png) 1. (Opcional) En **Canned ACL** puede aplicar un conjunto de garantías predefinidas, conocido como una [ACL predefinida](https://docs.aws.amazon.com/AmazonS3/latest/userguide/acl-overview.html#canned-acl) a los artefactos cargados. 1. (Opcional) En **Cache control (Control del caché)** introduzca los parámetros de caché. Puede establecerlo para controlar el comportamiento del caché para las solicitudes/respuestas. Para valores válidos, consulte el [http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.9](http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.9)campo del encabezado para las operaciones HTTP 1. Elija **Siguiente**. 1. En el **paso 7: Revisar**, revise la información y, a continuación, seleccione **Crear canalización**. 1. Después de la canalización se ejecute correctamente, abra la consola de Amazon S3 y compruebe que los archivos aparecen en el bucket público, tal como se muestra a continuación: ``` index.html main.css graphic.jpg ``` 1. Obtenga acceso al punto de enlace para probar el sitio web. El punto de enlace tiene este formato: `http://bucket-name.s3-website-region.amazonaws.com/`. Ejemplo de punto de enlace: `http://my-bucket.s3-website-us-west-2.amazonaws.com/`. Aparece la siguiente página web de muestra. ### Paso 3: Realizar un cambio en cualquier archivo de código fuente y verificar la implementación Realice un cambio en los archivos código fuente y, a continuación, envíe ese cambio al repositorio. Esto desencadena la ejecución de la canalización. Compruebe que el sitio web se actualiza. ## Opción 2: Implementar archivos compilados archivados en Amazon S3 desde un bucket de origen de S3 En esta opción, los comandos de compilación de la fase de compilación compilan el TypeScript código en JavaScript código y despliegan el resultado en el bucket de destino de S3 en una carpeta independiente con fecha y hora. Primero, crea el TypeScript código y un archivo buildspec.yml. Tras combinar los archivos fuente en un archivo ZIP, se carga el archivo ZIP de origen en el bucket de origen de S3 y se utiliza un CodeBuild escenario para implementar un archivo ZIP de aplicación creado en el bucket de destino de S3. El código compilado se conserva en formato comprimido en el bucket de destino. ### Requisitos previos Debe disponer de lo siguiente: + Un bucket de origen de S3. Puede utilizar el bucket que creó en [Tutorial: Crear una canalización simple (bucket de S3)](tutorials-simple-s3.md). + Un bucket de destino de S3. Consulte [Alojamiento de un sitio web estático en Amazon S3](https://docs.aws.amazon.com/AmazonS3/latest/userguide/WebsiteHosting.html). Asegúrese de crear su bucket de la Región de AWS misma manera que la canalización que desea crear. **nota** En este ejemplo, se muestra la implementación de archivos en un bucket privado. No habilite el bucket de destino para el alojamiento de sitios web ni le asocie políticas que lo conviertan en un bucket público. ### Paso 1: Crear y cargar los archivos de código fuente en un bucket de código fuente de S3 En esta sección, debe crear y cargar los archivos de código fuente en el bucket que utiliza la canalización para la etapa de código fuente. En esta sección, se proporcionan instrucciones para la creación de los siguientes archivos de código fuente: + Un `buildspec.yml` archivo que se utiliza para proyectos de CodeBuild construcción. + Un archivo `index.ts`. **Para crear un archivo buildspec.yml** + Cree un archivo denominado `buildspec.yml` con el siguiente contenido. Estos comandos de compilación instalan TypeScript y utilizan el TypeScript compilador para reescribir el código en `index.ts` código. JavaScript ``` version: 0.2 phases: install: commands: - npm install -g typescript build: commands: - tsc index.ts artifacts: files: - index.js ``` **Para crear un archivo index.ts** + Cree un archivo denominado `index.ts` con el siguiente contenido. ``` interface Greeting { message: string; } class HelloGreeting implements Greeting { message = "Hello!"; } function greet(greeting: Greeting) { console.log(greeting.message); } let greeting = new HelloGreeting(); greet(greeting); ``` **Para cargar los archivos en un bucket de código fuente de S3** 1. Sus archivos deberían ser parecidos a estos en su directorio local: ``` buildspec.yml index.ts ``` Comprima los archivos y asigne al archivo el nombre `source.zip`. 1. En la consola de Amazon S3, para el bucket de origen, elija **Cargar**. Elija **Add files (Añadir archivos)**, a continuación, busque el archivo ZIP que ha creado. 1. Seleccione **Cargar**. Estos archivos son el artefacto de código fuente creado por el asistente **Create Pipeline (Crear canalización)** para la acción de implementación en CodePipeline. El archivo debería aparecer así en el bucket: ``` source.zip ``` ### Paso 2: Crear la canalización En esta sección, debe crear una canalización con las siguientes acciones: + Una etapa de origen con una acción de Amazon S3 en la que los artefactos de origen son los archivos de la aplicación descargable. + Una etapa de implementación con una acción de implementación de Amazon S3. **Para crear una canalización con el asistente** 1. [Inicie sesión en la CodePipeline consola Consola de administración de AWS y ábrala en http://console.aws.amazon. com/codesuite/codepipeline/home](https://console.aws.amazon.com/codesuite/codepipeline/home). 1. En la página **Bienvenido**, **Introducción** o en la página **Canalizaciones**, elija **Crear canalización**. 1. En la página **Paso 1: elección de la opción de creación**, en **Opciones de creación**, seleccione la opción **Crear una canalización personalizada**. Elija **Siguiente**. 1. En **Paso 2: elegir la configuración de la canalización**, en **Nombre de la canalización**, escriba **MyS3DeployPipeline**. 1. En **Función de servicio**, elija **Nueva función de servicio** CodePipeline para poder crear una función de servicio en IAM. 1. En **Advanced settings (Configuración avanzada)**, deje los valores predeterminados y elija **Next (Siguiente)**. 1. En **Paso 3: agregar la etapa de origen**, en **Proveedor de origen**, elija **Amazon S3**. En **Bucket**, elija el nombre del bucket de código fuente. En **S3 object key (Clave de objeto de S3)**, escriba el nombre del archivo ZIP de código fuente. Asegúrese de incluir la extensión de archivo .zip. Elija **Siguiente**. 1. En **Paso 4: agregar la etapa de compilación**: 1. En **Build provider (Proveedor de compilación)**, elija **CodeBuild**. 1. Elija **Crear el proyecto de compilación**. En la página **Create project (Crear proyecto)**: 1. En **Project name (Nombre de proyecto)**, escriba un nombre para este proyecto de compilación. 1. En **Environment (Entorno)**, elija **Managed image (Imagen administrada)**. En **Operating system (Sistema operativo)**, elija **Ubuntu**. 1. En **Runtime**, elija **Standard (Estándar)**. **Para la **versión Runtime**, elijaaws/codebuild/standard: 1.0.** 1. En **Image version (Version de la imagen)**, elija **Always use the latest image for this runtime version (Utilizar siempre la imagen más reciente para esta versión del tiempo de ejecución)**. 1. En **Rol de servicio**, elija su rol CodeBuild de servicio o cree uno. 1. En **Build specifications (Especificaciones de compilación)**, elija **Use a buildspec file (Usar un archivo buildspec)**. 1. Selecciona **Continuar a CodePipeline**. Se muestra un mensaje si el proyecto se ha creado correctamente. 1. Elija **Siguiente**. 1. En **Paso 5: agregar la etapa de implementación**: 1. En **Deploy provider (Proveedor de implementación)**, elija **Amazon S3**. 1. En **Bucket**, especifique el nombre del bucket de destino de S3. 1. Asegúrese de que no está seleccionada la opción **Extract file before deploy (Extraer el archivo antes de la implementación)**. Cuando no está seleccionada la opción **Extract file before deploy (Extraer el archivo antes de la implementación)**, se muestra **S3 object key (Clave de objeto de S3)**. Especifique el nombre de la ruta que desea utilizar: `js-application/{datetime}.zip`. Esto crea una carpeta `js-application` en Amazon S3 en la que se extraen los archivos. En esta carpeta, la variable `{datetime}` crea una marca de tiempo en cada archivo de salida cuando se ejecuta la canalización. ![\[La página Paso 5: implementación para una acción de implementación de Amazon S3 con origen de Amazon S3\]](http://docs.aws.amazon.com/es_es/codepipeline/latest/userguide/images/tutorial-s3deploy-stage-s3source.png) 1. (Opcional) En **Canned ACL** puede aplicar un conjunto de garantías predefinidas, conocido como una [ACL predefinida](https://docs.aws.amazon.com/AmazonS3/latest/userguide/acl-overview.html#canned-acl) a los artefactos cargados. 1. (Opcional) En **Cache control (Control del caché)** introduzca los parámetros de caché. Puede establecerlo para controlar el comportamiento del caché para las solicitudes/respuestas. Para valores válidos, consulte el [http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.9](http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.9)campo del encabezado para las operaciones HTTP 1. Elija **Siguiente**. 1. En **Step 6: Review**, revise la información y después elija **Create pipeline**. 1. Después de que la canalización se ejecute correctamente, visualice el bucket en la consola de Amazon S3. Compruebe que el archivo ZIP implementado se muestre en el bucket de destino en la carpeta `js-application`. El JavaScript archivo contenido en el archivo ZIP debe ser`index.js`. El archivo `index.js` contiene la salida siguiente: ``` var HelloGreeting = /** @class */ (function () { function HelloGreeting() { this.message = "Hello!"; } return HelloGreeting; }()); function greet(greeting) { console.log(greeting.message); } var greeting = new HelloGreeting(); greet(greeting); ``` ### Paso 3: Realizar un cambio en cualquier archivo de código fuente y verificar la implementación Realice un cambio en los archivos de código fuente y, a continuación, cárguelos en el bucket de código fuente. Esto desencadena la ejecución de la canalización. Visualice el bucket de destino y verifique que los archivos de salida implementados estén disponibles en la carpeta `js-application`, tal y como se muestra a continuación: ![\[Ejemplo de descarga de archivo ZIP\]](http://docs.aws.amazon.com/es_es/codepipeline/latest/userguide/images/tutorial-s3deploy-pipeline-appzip.png)