arrow_back

Cómo alojar una aplicación web en Google Cloud mediante Compute Engine

Acceder Unirse
Test and share your knowledge with our community!
done
Get access to over 700 hands-on labs, skill badges, and courses

Cómo alojar una aplicación web en Google Cloud mediante Compute Engine

Lab 1 hora universal_currency_alt 5 créditos show_chart Intermedio
Test and share your knowledge with our community!
done
Get access to over 700 hands-on labs, skill badges, and courses

GSP662

Labs de autoaprendizaje de Google Cloud

Descripción general

Existen varias formas de implementar sitios web en Google Cloud, y cada solución ofrece diferentes funciones, capacidades y niveles de control. Compute Engine ofrece un amplio nivel de control sobre la infraestructura utilizada para ejecutar un sitio web, pero también requiere un poco más de administración operativa que otras soluciones como Google Kubernetes Engines (GKE) o App Engine, entre otras. Compute Engine le permite tener un control más detallado sobre distintos aspectos de la infraestructura, como las máquinas virtuales y los balanceadores de cargas, por ejemplo. En este lab, implementará una aplicación de muestra, el sitio web de comercio electrónico "Fancy Store", y comprobará que es muy simple implementar y escalar un sitio web mediante Compute Engine.

Qué aprenderá

Al terminar el lab, tendrá instancias dentro de grupos de instancias administrados para realizar tareas de reparación automática, balanceo de cargas, ajuste de escala automático y actualización progresiva del sitio web.

Configuración del entorno

Antes de hacer clic en el botón Comenzar lab

Lee estas instrucciones. Los labs son cronometrados y no se pueden pausar. El cronómetro, que comienza a funcionar cuando haces clic en Comenzar lab, indica por cuánto tiempo tendrás a tu disposición los recursos de Google Cloud.

Este lab práctico te permitirá realizar las actividades correspondientes en un entorno de nube real, no en uno de simulación o demostración. Para ello, se te proporcionan credenciales temporales nuevas que utilizarás para acceder a Google Cloud durante todo el lab.

Para completar este lab, necesitarás lo siguiente:

  • Acceso a un navegador de Internet estándar (se recomienda el navegador Chrome)
Nota: Usa una ventana de navegador privada o de Incógnito para ejecutar este lab. Así evitarás cualquier conflicto entre tu cuenta personal y la cuenta de estudiante, lo que podría generar cargos adicionales en tu cuenta personal.
  • Tiempo para completar el lab: Recuerda que, una vez que comienzas un lab, no puedes pausarlo.
Nota: Si ya tienes un proyecto o una cuenta personal de Google Cloud, no los uses en este lab para evitar cargos adicionales en tu cuenta.

Cómo iniciar su lab y acceder a la consola de Google Cloud

  1. Haga clic en el botón Comenzar lab. Si debe pagar por el lab, se abrirá una ventana emergente para que seleccione su forma de pago. A la izquierda, se encuentra el panel Detalles del lab que tiene estos elementos:

    • El botón Abrir la consola de Google
    • Tiempo restante
    • Las credenciales temporales que debe usar para el lab
    • Otra información para completar el lab, si es necesaria
  2. Haga clic en Abrir la consola de Google. El lab inicia recursos y abre otra pestaña en la que se muestra la página de acceso.

    Sugerencia: Ordene las pestañas en ventanas separadas, una junto a la otra.

    Nota: Si ve el diálogo Elegir una cuenta, haga clic en Usar otra cuenta.
  3. Si es necesario, copie el nombre de usuario del panel Detalles del lab y péguelo en el cuadro de diálogo Acceder. Haga clic en Siguiente.

  4. Copie la contraseña del panel Detalles del lab y péguela en el cuadro de diálogo de bienvenida. Haga clic en Siguiente.

    Importante: Debe usar las credenciales del panel de la izquierda. No use sus credenciales de Google Cloud Skills Boost. Nota: Usar su propia Cuenta de Google podría generar cargos adicionales.
  5. Haga clic para avanzar por las páginas siguientes:

    • Acepte los términos y condiciones.
    • No agregue opciones de recuperación o autenticación de dos factores (esta es una cuenta temporal).
    • No se registre para obtener pruebas gratuitas.

Después de un momento, se abrirá la consola de Cloud en esta pestaña.

Nota: Para ver el menú con una lista de los productos y servicios de Google Cloud, haga clic en el Menú de navegación que se encuentra en la parte superior izquierda de la pantalla. Ícono del menú de navegación

Activa Cloud Shell

Cloud Shell es una máquina virtual que cuenta con herramientas para desarrolladores. Ofrece un directorio principal persistente de 5 GB y se ejecuta en Google Cloud. Cloud Shell proporciona acceso de línea de comandos a tus recursos de Google Cloud.

  1. Haz clic en Activar Cloud Shell Ícono de Activar Cloud Shell en la parte superior de la consola de Google Cloud.

Cuando te conectes, habrás completado la autenticación, y el proyecto estará configurado con tu PROJECT_ID. El resultado contiene una línea que declara el PROJECT_ID para esta sesión:

Your Cloud Platform project in this session is set to YOUR_PROJECT_ID

gcloud es la herramienta de línea de comandos de Google Cloud. Viene preinstalada en Cloud Shell y es compatible con la función de autocompletado con tabulador.

  1. Puedes solicitar el nombre de la cuenta activa con este comando (opcional):
gcloud auth list
  1. Haz clic en Autorizar.

  2. Ahora, el resultado debería verse de la siguiente manera:

Resultado:

ACTIVE: * ACCOUNT: student-01-xxxxxxxxxxxx@qwiklabs.net To set the active account, run: $ gcloud config set account `ACCOUNT`
  1. Puedes solicitar el ID del proyecto con este comando (opcional):
gcloud config list project

Resultado:

[core] project = <project_ID>

Resultado de ejemplo:

[core] project = qwiklabs-gcp-44776a13dea667a6 Nota: Para obtener toda la documentación de gcloud, consulta la guía con la descripción general de gcloud CLI en Google Cloud.

Establezca la zona predeterminada y la configuración del proyecto:

gcloud config set compute/zone us-central1-f

Obtenga más información en la documentación Regiones y zonas.

Habilite la API de Compute Engine

A continuación, habilite la API de Compute Engine. Para ello, ejecute el siguiente comando:

gcloud services enable compute.googleapis.com

Cree depósitos de GCS

Usará un depósito de Google Cloud Storage para alojar su código compilado y su secuencia de comandos de inicio.

Desde Cloud Shell, ejecute el siguiente comando para crear un nuevo depósito de GCS:

gsutil mb gs://fancy-store-$DEVSHELL_PROJECT_ID

Haga clic en Revisar mi progreso para verificar el objetivo. Crear depósito de GCS

Clone el repositorio fuente

Utilizará el sitio web de comercio electrónico Fancy Store que se basa en el repositorio monolith-to-microservices como modelo para su sitio web. Clonará el código fuente para poder enfocarse en los aspectos de la implementación en Compute Engine. Más adelante en este lab, realizará una pequeña actualización en el código para comprobar lo fácil que es realizar actualizaciones en Compute Engine.

git clone https://github.com/googlecodelabs/monolith-to-microservices.git
cd ~/monolith-to-microservices

Ejecute la compilación inicial del código para permitir que se ejecute la aplicación de manera local:

./setup.sh

Esta secuencia de comandos tardará unos minutos en finalizar.

Una vez completado, asegúrese de que Cloud Shell esté ejecutando una versión compatible de nodeJS con el siguiente comando:

nvm install --lts

Una vez que se haya completado, ejecute los siguientes comandos para probar la aplicación, cambiar al directorio microservices e iniciar el servidor web:

cd microservices
npm start

Debería ver el siguiente resultado:

Products microservice listening on port 8082!
Frontend microservice listening on port 8080!
Orders microservice listening on port 8081!

Para obtener una vista previa de su aplicación, haga clic en el ícono de vista previa en la Web y seleccione Vista previa en el puerto 8080.

6634c06dd0b9172c.png

Eso abrirá una nueva ventana, en la que verá el frontend de Fancy Store en acción.

f075aec979aaffc8.png

Puede cerrar esta ventana después de ver el sitio web. Para detener el proceso del servidor web, presione Ctrl + C en la ventana de terminal.

Cree instancias de GCE

Es hora de comenzar a implementar algunas instancias de Compute Engine.

Siga estos pasos:

  1. Cree una secuencia de comandos de inicio para configurar las instancias.

  2. Clone el código fuente y súbalo a Google Cloud Storage.

  3. Implemente una instancia de Compute Engine para alojar los microservicios de backend.

  4. Reconfigure el código de frontend para utilizar la instancia de microservicios de backend.

  5. Implemente una instancia de Compute Engine para alojar el microservicio de frontend.

  6. Configure la red para permitir la comunicación.

Cree una secuencia de comandos de inicio

Se usará la secuencia de comandos de inicio para indicarle a la instancia qué hacer cada vez que se inicie. De esta forma, se configuran automáticamente las instancias.

Haga clic en Abrir Editor en la cinta de opciones de Cloud Shell para abrir el Editor de código.

cf0147b6cdd21baa.png

Navegue a la carpeta monolith-to-microservices.

Haga clic en File > New File y cree un archivo llamado startup-script.sh.

439553c934139b82.png

Agregue el siguiente código al archivo. Una vez que lo haya agregado, editará una parte del código:

#!/bin/bash
# Install logging monitor. The monitor will automatically pick up logs sent to
# syslog.
curl -s "https://storage.googleapis.com/signals-agents/logging/google-fluentd-install.sh" | bash
service google-fluentd restart &
# Install dependencies from apt
apt-get update
apt-get install -yq ca-certificates git build-essential supervisor psmisc
# Install nodejs
mkdir /opt/nodejs
curl https://nodejs.org/dist/v16.14.0/node-v16.14.0-linux-x64.tar.gz | tar xvzf - -C /opt/nodejs --strip-components=1
ln -s /opt/nodejs/bin/node /usr/bin/node
ln -s /opt/nodejs/bin/npm /usr/bin/npm
# Get the application source code from the Google Cloud Storage bucket.
mkdir /fancy-store
gsutil -m cp -r gs://fancy-store-[DEVSHELL_PROJECT_ID]/monolith-to-microservices/microservices/* /fancy-store/
# Install app dependencies.
cd /fancy-store/
npm install
# Create a nodeapp user. The application will run as this user.
useradd -m -d /home/nodeapp nodeapp
chown -R nodeapp:nodeapp /opt/app
# Configure supervisor to run the node app.
cat >/etc/supervisor/conf.d/node-app.conf << EOF
[program:nodeapp]
directory=/fancy-store
command=npm start
autostart=true
autorestart=true
user=nodeapp
environment=HOME="/home/nodeapp",USER="nodeapp",NODE_ENV="production"
stdout_logfile=syslog
stderr_logfile=syslog
EOF
supervisorctl reread
supervisorctl update

Busque el texto [DEVSHELL_PROJECT_ID] en el archivo y reemplácelo por el resultado del siguiente comando:

echo $DEVSHELL_PROJECT_ID

Resultado de ejemplo:

qwiklabs-gcp-123456789xyz

La línea de código de startup-script.sh debería ser similar a la que se ve a continuación:

gs://fancy-store-qwiklabs-gcp-123456789xyz/monolith-to-microservices/microservices/* /fancy-store/

Guarde el archivo y luego ciérrelo.

Editor de código de Cloud Shell: Asegúrese de que la opción "Secuencia de fin de línea" esté configurada como "LF" y no como "CRLF". Mire la esquina inferior derecha del editor de código para comprobarlo: img/935973afd3bdf852.png

Si está configurada como CRLF, haga clic en CRLF y seleccione LF en el menú desplegable.

La secuencia de comandos de inicio realiza las siguientes tareas:

  • Instala el agente de Logging, que recopila automáticamente registros de syslog.
  • Instala Node.js y Supervisor (este último ejecuta la aplicación como un daemon).
  • Clona el código fuente de la app desde el depósito de GCS e instala dependencias.
  • Configura Supervisor para ejecutar la app. Supervisor se asegura de que se reinicie la app, ya sea si se cierra de forma inesperada o si la detiene un administrador o algún otro proceso. También envía las transmisiones stdout y stderr de la aplicación a syslog para que los recopile el agente de Logging.

Ejecute el siguiente comando para copiar el archivo startup-script.sh en su depósito:

gsutil cp ~/monolith-to-microservices/startup-script.sh gs://fancy-store-$DEVSHELL_PROJECT_ID

Ahora podrá acceder al archivo mediante el siguiente vínculo: https://storage.googleapis.com/[BUCKET_NAME]/startup-script.sh.

[BUCKET_NAME] representa el nombre del depósito de Cloud Storage. De manera predeterminada, este archivo solo estará visible para cuentas de servicio y usuarios autorizados, por lo que no será posible acceder a él mediante un navegador web. Las instancias de Compute Engine podrán acceder automáticamente a través de su cuenta de servicio.

Copie el código en el depósito de Cloud Storage

Cuando se lanzan las instancias, estas extraen el código del depósito de Cloud Storage, por lo que es posible almacenar algunas variables de configuración en el archivo.env del código.

Copie el código clonado en el depósito:

cd ~
rm -rf monolith-to-microservices/*/node_modules
gsutil -m cp -r monolith-to-microservices gs://fancy-store-$DEVSHELL_PROJECT_ID/

Haga clic en Revisar mi progreso para verificar el objetivo. Copiar la secuencia de comandos de inicio y el código en el depósito de Cloud Storage

Implemente la instancia de backend

La primera instancia que implementará será la de backend, que alojará los microservicios de Pedidos y Productos.

Ejecute el siguiente comando a fin de crear una instancia n1-standard-1 configurada para usar la secuencia de comandos de inicio. Está etiquetada como una instancia backend para que después le permita aplicar reglas de firewall específicas:

gcloud compute instances create backend \
    --machine-type=n1-standard-1 \
    --tags=backend \
   --metadata=startup-script-url=https://storage.googleapis.com/fancy-store-$DEVSHELL_PROJECT_ID/startup-script.sh

Configure la conexión al backend

Antes de implementar el frontend de la aplicación, es necesario actualizar la configuración para que se dirija al backend que acaba de implementar.

Para obtener la dirección IP externa del backend, ejecute el siguiente comando y busque la dirección en la pestaña EXTERNAL_IP:

gcloud compute instances list

Resultado de ejemplo:

NAME     ZONE           MACHINE_TYPE  PREEMPTIBLE  INTERNAL_IP  EXTERNAL_IP   STATUS
backend  us-central1-f  n1-standard-1                   10.128.0.2   34.68.223.88  RUNNING

Copie la IP externa del backend.

En el explorador de Cloud Shell, navegue a monolith-to-microservices > react-app.

En el editor de código, seleccione View > Toggle Hidden Files para ver el archivo .env.

e7314ceda643e16.png

Edite el archivo .env para que dirija a la IP externa del backend. [BACKEND_ADDRESS] representa la dirección IP externa de la instancia de backend determinada a partir del comando gcloud ejecutado previamente.

En el archivo .env, reemplace localhost por su [BACKEND_ADDRESS]:

REACT_APP_ORDERS_URL=http://[BACKEND_ADDRESS]:8081/api/orders
REACT_APP_PRODUCTS_URL=http://[BACKEND_ADDRESS]:8082/api/products

Guarde el archivo.

Vuelva a compilar react-app, lo que actualizará el código de frontend:

cd ~/monolith-to-microservices/react-app
npm install && npm run-script build

A continuación, copie el código de la aplicación en el depósito de Cloud Storage:

cd ~
rm -rf monolith-to-microservices/*/node_modules
gsutil -m cp -r monolith-to-microservices gs://fancy-store-$DEVSHELL_PROJECT_ID/

Implemente la instancia de frontend

Una vez que haya configurado el código, implemente la instancia de frontend.

Ejecute el siguiente comando para implementar la instancia de frontend con un comando similar al anterior. Esta instancia está etiquetada como frontend por motivos relacionados con el firewall:

gcloud compute instances create frontend \
    --machine-type=n1-standard-1 \
    --tags=frontend \
    --metadata=startup-script-url=https://storage.googleapis.com/fancy-store-$DEVSHELL_PROJECT_ID/startup-script.sh

Configure la red

Cree reglas de firewall que permitan que el frontend acceda al puerto 8080, y el backend, a los puertos 8081 y 8082. Estos comandos de firewall utilizan las etiquetas que se asignan al momento de crear las instancias para la aplicación:

gcloud compute firewall-rules create fw-fe \
    --allow tcp:8080 \
    --target-tags=frontend
gcloud compute firewall-rules create fw-be \
    --allow tcp:8081-8082 \
    --target-tags=backend

Ahora el sitio web debería funcionar en su totalidad.

Para navegar a la IP externa del frontend, debe conocer la dirección. Ejecute el siguiente comando y busque la dirección IP externa de la instancia de frontend en la pestaña EXTERNAL_IP:

gcloud compute instances list

Resultado de ejemplo:

NAME      ZONE           MACHINE_TYPE   PREEMPTIBLE  INTERNAL_IP  EXTERNAL_IP     STATUS
backend   us-central1-f  n1-standard-1               10.128.0.2   35.184.46.126   RUNNING
frontend  us-central1-f  n1-standard-1               10.128.0.3   35.223.110.167  RUNNING

Es posible que la instancia tarde algunos minutos en iniciarse y configurarse.

Espere 30 segundos y, luego, ejecute el siguiente comando para supervisar que se esté preparando la aplicación. Reemplace FRONTEND_ADDRESS por la IP externa de la instancia de frontend:

watch -n 2 curl http://[FRONTEND_ADDRESS]:8080

Una vez que vea un resultado similar al siguiente, el sitio web debería estar listo.

80dc8721dc08d7e4.png

Presione Ctrl + C para detener el comando watch.

Abra una nueva pestaña en el navegador y diríjase a http://[FRONTEND_ADDRESS]:8080 para acceder al sitio web. [FRONTEND_ADDRESS] es la dirección IP externa de frontend determinada anteriormente.

Intente navegar a las páginas Products y Orders, que ya deberían estar en funcionamiento.

a11460a1fffb07d8.png

Haga clic en Revisar mi progreso para verificar el objetivo. Implementar las instancias y configurar la red

Cree grupos de instancias administrados

Para permitir el escalamiento de la aplicación, se crearán grupos de instancias administrados, que utilizarán las instancias de frontend y backend como plantillas de instancias.

Un grupo de instancias administrado (MIG) contiene instancias idénticas que usted puede administrar como una única entidad en una única zona. Los grupos de instancias administrados mantienen la alta disponibilidad de sus aplicaciones, ya que conservan sus instancias disponibles de manera proactiva, es decir, en estado RUNNING. Utilizaremos grupos de instancias administrados para que nuestras instancias de frontend y backend cuenten con reparación automática, balanceo de cargas, ajuste de escala automático y actualizaciones progresivas.

Cree una plantilla de instancias desde una instancia de origen

Antes de crear un grupo de instancias administrado, debe crear una plantilla de instancias que será la base del grupo. Las plantillas de instancias le permiten definir el tipo de máquina, la imagen del disco de arranque o del contenedor, la red y otras propiedades de la instancia que usará al crear nuevas instancias de VM. Puede usar esas plantillas para crear instancias en un grupo de instancias administrado o incluso instancias individuales.

Para crear la plantilla de instancias, utilice las instancias que ya creó anteriormente.

Primero, detenga ambas instancias:

gcloud compute instances stop frontend
gcloud compute instances stop backend

Luego, cree la plantilla de instancias desde cada una de las instancias de origen:

gcloud compute instance-templates create fancy-fe \
    --source-instance=frontend
gcloud compute instance-templates create fancy-be \
    --source-instance=backend

Confirme que se hayan creado las plantillas de instancias:

gcloud compute instance-templates list

Resultado de ejemplo:

NAME      MACHINE_TYPE  PREEMPTIBLE  CREATION_TIMESTAMP
fancy-be  n1-standard-1                  2020-02-03T10:34:12.966-08:00
fancy-fe  n1-standard-1                   2020-02-03T10:34:01.082-08:00

Con las plantillas de instancia creadas, elimine la máquina virtual "backend" para ahorrar espacio de recursos:

gcloud compute instances delete backend

Escriba e ingrese Y cuando se le solicite.

Normalmente, también podría eliminar la máquina virtual "frontend", pero la usará para actualizar la plantilla de instancia más adelante en el laboratorio.

Cree un grupo de instancias administrado

A continuación, cree dos grupos de instancias administrados: uno para el frontend y otro para el backend:

gcloud compute instance-groups managed create fancy-fe-mig \
    --base-instance-name fancy-fe \
    --size 2 \
    --template fancy-fe
gcloud compute instance-groups managed create fancy-be-mig \
    --base-instance-name fancy-be \
    --size 2 \
    --template fancy-be

Esos grupos de instancias administrados usarán las plantillas de instancias y están configurados para tener dos instancias en cada grupo para iniciar. Esas instancias reciben automáticamente un nombre según el base-instance-name especificado con caracteres aleatorios agregados.

Para su aplicación, el microservicio frontend se ejecuta en el puerto 8080. Por su parte, el microservicio backend lo hace en el puerto 8081 para orders y en el puerto 8082 para products:

gcloud compute instance-groups set-named-ports fancy-fe-mig \
    --named-ports frontend:8080
gcloud compute instance-groups set-named-ports fancy-be-mig \
    --named-ports orders:8081,products:8082

Dado que esos son puertos no estándar, debe especificar puertos con nombre para identificarlos. Los puertos con nombre son metadatos de pares clave-valor que muestran el nombre del servicio y el puerto en el que se ejecuta. Los puertos con nombre se pueden asignar a un grupo de instancias; eso indica que el servicio está disponible en todas las instancias del grupo. A esta información la usa el servicio de balanceo de cargas HTTP que será configurado más adelante.

Configure la reparación automática

A fin de mejorar la disponibilidad de la aplicación y verificar que responda, configure una política de reparación automática para los grupos de instancias administrados.

Una política de reparación automática depende de una verificación de estado basada en aplicaciones para comprobar que la aplicación responda según lo esperado. Es más preciso controlar que una aplicación responde que simplemente verificar que una instancia está en estado RUNNING (el comportamiento predeterminado).

Cree una verificación de estado para el frontend y el backend que repare la instancia si pasa a estar en mal estado 3 veces consecutivas:

gcloud compute health-checks create http fancy-fe-hc \
    --port 8080 \
    --check-interval 30s \
    --healthy-threshold 1 \
    --timeout 10s \
    --unhealthy-threshold 3
gcloud compute health-checks create http fancy-be-hc \
    --port 8081 \
    --request-path=/api/orders \
    --check-interval 30s \
    --healthy-threshold 1 \
    --timeout 10s \
    --unhealthy-threshold 3

Cree una regla de firewall para permitir que los sondeos de verificación de estado se conecten con los microservicios en los puertos 8080 y 8081:

gcloud compute firewall-rules create allow-health-check \
    --allow tcp:8080-8081 \
    --source-ranges 130.211.0.0/22,35.191.0.0/16 \
    --network default

Aplique las verificaciones de estado a sus servicios respectivos:

gcloud compute instance-groups managed update fancy-fe-mig \
    --health-check fancy-fe-hc \
    --initial-delay 300
gcloud compute instance-groups managed update fancy-be-mig \
    --health-check fancy-be-hc \
    --initial-delay 300

Continúe con el lab para darle tiempo a la reparación automática de supervisar las instancias del grupo. Al final del lab, simulará una falla para probar la reparación automática.

Haga clic en Revisar mi progreso para verificar el objetivo. Crear grupos de instancias administrados

Cree balanceadores de cargas

Para complementar los grupos de instancias administrados, utilizará un balanceador de cargas HTTP(S) a fin de distribuir el tráfico hacia los microservicios de frontend y backend. También utilizará asignaciones para enviar tráfico hacia los servicios de backend apropiados, en función de reglas de rutas de acceso. Esto expondrá una única IP de carga balanceada para todos los servicios.

Puede obtener más información acerca de las opciones de balanceo de cargas en Google Cloud: Descripción general del balanceo de cargas.

Cree un balanceador de cargas HTTP(S)

Google Cloud Platform ofrece diferentes tipos de balanceadores de cargas. Para este lab, utilizará un balanceador de cargas HTTP(S) a fin de distribuir el tráfico. Un balanceador de cargas HTTP se estructura de la siguiente manera:

  1. Una regla de reenvío dirige las solicitudes entrantes a un proxy HTTP de destino.
  2. El proxy HTTP de destino compara cada solicitud con un mapa de URL a fin de determinar el servicio de backend apropiado para la solicitud.
  3. El servicio de backend dirige cada solicitud a un backend adecuado según la capacidad de entrega, la zona y el estado de la instancia de los backends asociados. El estado de cada instancia de backend se comprueba mediante una verificación de estado HTTP. Si el servicio de backend está configurado para usar una verificación de estado HTTPS o HTTP/2, se encriptará la solicitud de camino a la instancia de backend.
  4. Las sesiones entre el balanceador de cargas y la instancia pueden usar los protocolos HTTP, HTTPS o HTTP/2. Si usa los protocolos HTTPS o HTTP/2, cada instancia de los servicios de backend debe tener un certificado SSL.

Cree verificaciones de estado que se utilizarán para determinar qué instancias pueden distribuir tráfico para cada servicio:

gcloud compute http-health-checks create fancy-fe-frontend-hc \
  --request-path / \
  --port 8080
gcloud compute http-health-checks create fancy-be-orders-hc \
  --request-path /api/orders \
  --port 8081
gcloud compute http-health-checks create fancy-be-products-hc \
  --request-path /api/products \
  --port 8082

Cree servicios de backend hacia los que se pueda dirigir el tráfico de carga balanceada. Los servicios de backend utilizarán las verificaciones de estado y los puertos con nombre que usted creó:

gcloud compute backend-services create fancy-fe-frontend \
  --http-health-checks fancy-fe-frontend-hc \
  --port-name frontend \
  --global
gcloud compute backend-services create fancy-be-orders \
  --http-health-checks fancy-be-orders-hc \
  --port-name orders \
  --global
gcloud compute backend-services create fancy-be-products \
  --http-health-checks fancy-be-products-hc \
  --port-name products \
  --global

Agregue los servicios de backend del balanceador de cargas:

gcloud compute backend-services add-backend fancy-fe-frontend \
  --instance-group fancy-fe-mig \
  --instance-group-zone us-central1-f \
  --global
gcloud compute backend-services add-backend fancy-be-orders \
  --instance-group fancy-be-mig \
  --instance-group-zone us-central1-f \
  --global
gcloud compute backend-services add-backend fancy-be-products \
  --instance-group fancy-be-mig \
  --instance-group-zone us-central1-f \
  --global

Cree un mapa de URL. Este mapa define cuáles son las URL que se dirigen hacia cada uno de los servicios de backend:

gcloud compute url-maps create fancy-map \
  --default-service fancy-fe-frontend

Cree un comparador de rutas de acceso para permitir que las rutas /api/orders y /api/products se dirijan hacia sus respectivos servicios:

gcloud compute url-maps add-path-matcher fancy-map \
   --default-service fancy-fe-frontend \
   --path-matcher-name orders \
   --path-rules "/api/orders=fancy-be-orders,/api/products=fancy-be-products"

Cree el proxy que se vincula al mapa de URL:

gcloud compute target-http-proxies create fancy-proxy \
  --url-map fancy-map

Cree una regla de reenvío global que vincule el proxy a una dirección IP pública y a un puerto:

gcloud compute forwarding-rules create fancy-http-rule \
  --global \
  --target-http-proxy fancy-proxy \
  --ports 80

Haga clic en Revisar mi progreso para verificar el objetivo. Crear balanceadores de cargas HTTP(S)

Actualice la configuración

Ahora que tiene una nueva dirección IP estática, actualice el código del frontend para que dirija hacia esta dirección, en lugar de hacia la dirección temporal que utilizó antes y que llevaba a la instancia de backend.

En Cloud Shell, cambie a la carpeta react-app que contiene el archivo .env con la configuración:

cd ~/monolith-to-microservices/react-app/

Busque la dirección IP del balanceador de cargas:

gcloud compute forwarding-rules list --global

Resultado de ejemplo:

NAME                    REGION  IP_ADDRESS     IP_PROTOCOL  TARGET
fancy-http-rule          34.102.237.51  TCP          fancy-proxy

Regrese al editor de Cloud Shell y edite el archivo .env otra vez para que dirija hacia la IP pública del balanceador de cargas. [LB_IP] representa la dirección IP externa de la instancia de backend que se determinó anteriormente.

REACT_APP_ORDERS_URL=http://[LB_IP]/api/orders
REACT_APP_PRODUCTS_URL=http://[LB_IP]/api/products

Guarde el archivo.

Vuelva a compilar react-app, lo que actualizará el código de frontend:

cd ~/monolith-to-microservices/react-app
npm install && npm run-script build

Copie el código de la aplicación en su depósito:

cd ~
rm -rf monolith-to-microservices/*/node_modules
gsutil -m cp -r monolith-to-microservices gs://fancy-store-$DEVSHELL_PROJECT_ID/

Actualice las instancias de frontend

Ahora que hay un nuevo código y una nueva configuración, es necesario que las instancias de frontend ubicadas en el grupo de instancias administrado extraigan el nuevo código. Dado que las instancias extraen el código al iniciarse, puede ejecutar un comando de reinicio progresivo:

gcloud compute instance-groups managed rolling-action replace fancy-fe-mig \
    --max-unavailable 100%

Haga clic en Revisar mi progreso para verificar el objetivo. Actualizar las instancias de frontend

Pruebe el sitio web

Espere unos 30 segundos después de ejecutar el comando rolling-action replace para dar tiempo a que se procesen las instancias y, luego, compruebe el estado del grupo de instancias administrado hasta que las instancias aparezcan en la lista:

watch -n 2 gcloud compute instance-groups list-instances fancy-fe-mig

Una vez que aparezcan en la lista, presione Ctrl + C para salir del comando watch.

Ejecute el siguiente comando para confirmar que el servicio figure como HEALTHY:

watch -n 2 gcloud compute backend-services get-health fancy-fe-frontend --global

Espere hasta que los dos servicios figuren como HEALTHY.

Resultado de ejemplo:

---
backend: https://www.googleapis.com/compute/v1/projects/my-gce-codelab/zones/us-central1-a/instanceGroups/fancy-fe-mig
status:
  healthStatus:
  - healthState: HEALTHY
    instance: https://www.googleapis.com/compute/v1/projects/my-gce-codelab/zones/us-central1-a/instances/fancy-fe-x151
    ipAddress: 10.128.0.7
    port: 8080
  - healthState: HEALTHY
    instance: https://www.googleapis.com/compute/v1/projects/my-gce-codelab/zones/us-central1-a/instances/fancy-fe-cgrt
    ipAddress: 10.128.0.11
    port: 8080
  kind: compute#backendServiceGroupHealth

Una vez que ambas figuren como HEALTHY en la lista, presione Ctrl + C para salir del comando watch.

Cómo escalar Compute Engine

Hasta ahora, creó dos grupos de instancias administrados con dos instancias cada uno. Esta configuración funciona correctamente, pero no deja de ser una configuración estática, más allá de la carga. A continuación, creará una política de ajuste de escala automático basado en el uso para escalar automáticamente cada grupo de instancias administrado.

Cambio de tamaño automático según el uso

Para crear la política de ajuste de escala automático, ejecute los siguientes comandos:

gcloud compute instance-groups managed set-autoscaling \
  fancy-fe-mig \
  --max-num-replicas 2 \
  --target-load-balancing-utilization 0.60
gcloud compute instance-groups managed set-autoscaling \
  fancy-be-mig \
  --max-num-replicas 2 \
  --target-load-balancing-utilization 0.60

Esos comandos crean un escalador automático en los grupos de instancia administrados que automáticamente agrega instancias cuando el uso supera el 60% o las quita cuando está por debajo de esa cifra.

Habilite la red de distribución de contenidos

Otra función que puede ser de utilidad con el escalamiento es habilitar el servicio de red de distribución de contenidos para brindarle almacenamiento en caché al frontend.

Ejecute el siguiente comando en el servicio de frontend:

gcloud compute backend-services update fancy-fe-frontend \
    --enable-cdn --global

Cuando un usuario solicita contenido del balanceador de cargas HTTP(S), la solicitud llega a un servicio Google Front End (GFE) que primero busca una respuesta para la solicitud en la caché de Cloud CDN. Si el GFE encuentra una respuesta almacenada en caché, la envía al usuario. Esto se conoce como acierto de caché.

Si el GFE no encuentra una respuesta almacenada en caché, realiza una solicitud directamente en el backend. Si se puede almacenar en caché la respuesta a ese pedido, el GFE la almacena en la caché de Cloud CDN para que pueda utilizarse en futuras solicitudes.

Haga clic en Revisar mi progreso para verificar el objetivo. Escalar GCE

Actualice el sitio web

Cómo actualizar la plantilla de instancias

No se pueden editar las plantillas de instancias que ya existen. Sin embargo, como sus instancias no tienen estado y toda la configuración se realiza a través de la secuencia de comandos de inicio, solo debe modificar la plantilla de instancias si desea cambiar las configuraciones de la plantilla. Ahora realizará un cambio simple para usar y desplegar un tipo de máquina más grande.

Actualice la instancia frontend que actúa como base de la plantilla de instancias. Durante la actualización, colocará un archivo en la versión actualizada de la imagen de la plantilla de instancias. Luego, actualizará la plantilla, ejecutará la nueva y confirmará que dicho archivo esté en las instancias del grupo de instancias administrado.

Ahora, modifique el tipo de máquina de su plantilla de instancias. Para hacerlo, cambie el tipo n1-standard-1 por uno personalizable con 4 vCPU y 3840 MiB de memoria RAM.

Ejecute el siguiente comando para modificar el tipo de máquina de la instancia de frontend:

gcloud compute instances set-machine-type frontend --machine-type custom-4-3840

Cree la nueva plantilla de instancias:

gcloud compute instance-templates create fancy-fe-new \
    --source-instance=frontend \
    --source-instance-zone=us-central1-f

Ejecute la plantilla de instancias actualizada en el grupo de instancias administrado:

gcloud compute instance-groups managed rolling-action start-update fancy-fe-mig \
    --version template=fancy-fe-new

Espere 30 segundos y ejecute lo siguiente para supervisar el estado de la actualización:

watch -n 2 gcloud compute instance-groups managed list-instances fancy-fe-mig

El proceso tardará unos minutos.

Una vez que tenga al menos una instancia en el siguiente estado:

  • STATUS: RUNNING
  • ACTION: Configurada como None
  • INSTANCE_TEMPLATE: El nuevo nombre de la plantilla (fancy-fe-new)

Copie el nombre de una de las máquinas de la lista para su utilización en el siguiente comando.

Presione Ctrl + C para salir del proceso watch.

Ejecute el siguiente comando para ver si la máquina virtual está utilizando el nuevo tipo de máquina (custom-4-3840). [VM_NAME] es la nueva instancia creada:

gcloud compute instances describe [VM_NAME] | grep machineType

Resultado esperado (ejemplo):

machineType: https://www.googleapis.com/compute/v1/projects/project-name/zones/us-central1-f/machineTypes/custom-4-3840

Realice cambios en el sitio web

Situación: Su equipo de marketing le pidió que cambie la página principal de su sitio. Cree que debería tener más información sobre su empresa y lo que vende.

Tarea: Agregue algunos párrafos en la página principal para complacer al equipo de marketing. Al parecer, uno de los desarrolladores ya realizó los cambios en el archivo llamado index.js.new. Puede simplemente copiar ese archivo en index.js, y deberían poder verse los cambios. Siga las instrucciones que se incluyen a continuación para realizar los cambios apropiados.

Ejecute los siguientes comandos para copiar el archivo actualizado en el nombre de archivo correcto:

cd ~/monolith-to-microservices/react-app/src/pages/Home
mv index.js.new index.js

Muestre el contenido del archivo para verificar los cambios:

cat ~/monolith-to-microservices/react-app/src/pages/Home/index.js

El código resultante debería verse de esta manera:

/*
Copyright 2019 Google LLC

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    https://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/

import React from "react";
import { makeStyles } from "@material-ui/core/styles";
import Paper from "@material-ui/core/Paper";
import Typography from "@material-ui/core/Typography";
const useStyles = makeStyles(theme => ({
  root: {
    flexGrow: 1
  },
  paper: {
    width: "800px",
    margin: "0 auto",
    padding: theme.spacing(3, 2)
  }
}));
export default function Home() {
  const classes = useStyles();
  return (
    <div className={classes.root}>
      <Paper className={classes.paper}>
        <Typography variant="h5">
          Fancy Fashion &amp; Style Online
        </Typography>
        <br />
        <Typography variant="body1">
          Tired of mainstream fashion ideas, popular trends and societal norms?
          This line of lifestyle products will help you catch up with the Fancy trend and express your personal style.
          Start shopping Fancy items now!
        </Typography>
      </Paper>
    </div>
  );
}

Ya actualizó los componentes de React, pero debe compilar la aplicación de React para generar archivos estáticos.

Ejecute el siguiente comando para compilar la aplicación y copiarla en el directorio público monolith:

cd ~/monolith-to-microservices/react-app
npm install && npm run-script build

Luego, vuelva a enviar este código al depósito:

cd ~
rm -rf monolith-to-microservices/*/node_modules
gsutil -m cp -r monolith-to-microservices gs://fancy-store-$DEVSHELL_PROJECT_ID/

Envíe los cambios mediante reemplazos progresivos

Ahora fuerce el reemplazo de todas las instancias para realizar la actualización:

gcloud compute instance-groups managed rolling-action replace fancy-fe-mig \
    --max-unavailable=100%

Haga clic en Revisar mi progreso para verificar el objetivo. Actualizar el sitio web

Espere unos 30 segundos después de ejecutar el comando rolling-action replace para dar tiempo a que se procesen las instancias y, luego, compruebe el estado del grupo de instancias administrado hasta que las instancias aparezcan en la lista:

watch -n 2 gcloud compute instance-groups list-instances fancy-fe-mig

Una vez que aparezcan en la lista, presione Ctrl + C para salir del comando watch.

Ejecute el siguiente comando para confirmar que el servicio figure como HEALTHY:

watch -n 2 gcloud compute backend-services get-health fancy-fe-frontend --global

Espere unos minutos hasta que aparezcan ambos servicios y figuren como HEALTHY.

Resultado de ejemplo:

---
backend: https://www.googleapis.com/compute/v1/projects/my-gce-codelab/zones/us-central1-a/instanceGroups/fancy-fe-mig
status:
  healthStatus:
  - healthState: HEALTHY
    instance: https://www.googleapis.com/compute/v1/projects/my-gce-codelab/zones/us-central1-a/instances/fancy-fe-x151
    ipAddress: 10.128.0.7
    port: 8080
  - healthState: HEALTHY
    instance: https://www.googleapis.com/compute/v1/projects/my-gce-codelab/zones/us-central1-a/instances/fancy-fe-cgrt
    ipAddress: 10.128.0.11
    port: 8080
  kind: compute#backendServiceGroupHealth

Una vez que aparezcan en la lista, presione Ctrl + C para salir del comando watch.

Diríjase al sitio web mediante http://[LB_IP], en donde [LB_IP] es la dirección IP que se especificó para el balanceador de cargas y que se puede encontrar mediante el siguiente comando:

gcloud compute forwarding-rules list --global

Ahora deberían verse los cambios en el sitio web.

b081b8e885bf0723.png

Simule una falla

Para confirmar que funcione la verificación de estado, acceda a una instancia y detenga los servicios.

Para encontrar el nombre de una instancia, ejecute el siguiente comando:

gcloud compute instance-groups list-instances fancy-fe-mig

Copie el nombre de una instancia y, luego, ejecute lo siguiente para asegurar la shell en la instancia. INSTANCE_NAME es una de las instancias de la lista:

gcloud compute ssh [INSTANCE_NAME]

Escriba "y" para confirmar y presione Intro dos veces para no usar una contraseña.

En la instancia, use supervisorctl para detener la aplicación:

sudo supervisorctl stop nodeapp; sudo killall node

Salga de la instancia:

exit

Supervise las operaciones de reparación:

watch -n 2 gcloud compute operations list \
--filter='operationType~compute.instances.repair.*'

Este proceso tardará unos minutos en completarse.

Busque el siguiente resultado de ejemplo:

NAME                                                  TYPE                                       TARGET                                 HTTP_STATUS  STATUS  TIMESTAMP
repair-1568314034627-5925f90ee238d-fe645bf0-7becce15  compute.instances.repair.recreateInstance  us-central1-a/instances/fancy-fe-1vqq  200          DONE    2019-09-12T11:47:14.627-07:00

El grupo de instancias administrado volvió a crear la instancia para repararla.

También puede realizar la supervisión a través de Console: diríjase a Menú de navegación > Compute Engine > Instancias de VM.

¡Felicitaciones!

Implementó, escaló y actualizó de manera exitosa su sitio web en Compute Engine. Ahora tiene experiencia con Compute Engine, grupos de instancias administrados, balanceadores de cargas y verificaciones de estado.

completion_badge_Website_on_Google_Cloud-135.png

Finalice su Quest

Este lab de autoaprendizaje forma parte de la Quest Website on Google Cloud de Qwiklabs. Una Quest es una serie de labs relacionados que forman una ruta de aprendizaje. Inscríbase en esta Quest y obtenga un crédito inmediato de finalización si realizó este lab. Consulte otras Quests de Qwiklabs disponibles.

¿Está buscando un Lab de desafío práctico para demostrar sus habilidades y validar su conocimiento? Una vez que haya completado esta Quest, realice este Lab de desafío adicional para recibir una insignia digital exclusiva de Google Cloud.

Build_a_Website_on_Google_Cloud_Skill_WBG-135.png

Realice su próximo lab

Continúe aprendiendo con Cómo implementar, escalar y actualizar su sitio web en Google Kubernetes Engine, o bien revise estas sugerencias:

Próximos pasos/Más información

Finaliza el lab

Cuando completes el lab, haz clic en Finalizar lab. Tu cuenta y los recursos que usaste se quitaron de la plataforma del lab.

Tendrás la oportunidad de calificar tu experiencia en el lab. Selecciona la cantidad de estrellas que corresponda, ingresa un comentario y haz clic en Enviar.

La cantidad de estrellas indica lo siguiente:

  • 1 estrella = Muy insatisfecho
  • 2 estrellas = Insatisfecho
  • 3 estrellas = Neutral
  • 4 estrellas = Satisfecho
  • 5 estrellas = Muy satisfecho

Puedes cerrar el cuadro de diálogo si no deseas proporcionar comentarios.

Para enviar comentarios, sugerencias o correcciones, usa la pestaña Asistencia.

Última actualización del manual: 24 febrero 2022
Prueba más reciente del lab: 24 febrero 2022

Copyright 2024 Google LLC. All rights reserved. Google y el logotipo de Google son marcas de Google LLC. Los demás nombres de productos y empresas pueden ser marcas de las respectivas empresas a las que estén asociados.