โฮสต์และปรับขนาดเว็บแอปใน Google Cloud ด้วย Compute Engine

1. บทนำ

การติดตั้งใช้งานเว็บไซต์ใน Google Cloud ทำได้หลายวิธี โดยแต่ละโซลูชันจะมีฟีเจอร์ ความสามารถ และระดับการควบคุมที่แตกต่างกัน Compute Engine ช่วยให้คุณควบคุมโครงสร้างพื้นฐานที่ใช้ในการเรียกใช้เว็บไซต์ได้อย่างละเอียด แต่ก็ต้องมีการจัดการการดำเนินงานมากกว่าโซลูชันอื่นๆ เช่น Google Kubernetes Engine, App Engine หรือโซลูชันอื่นๆ Compute Engine ช่วยให้คุณควบคุมรายละเอียดของโครงสร้างพื้นฐานได้ รวมถึงเครื่องเสมือน ตัวจัดสรรภาระงาน และอื่นๆ วันนี้คุณจะได้ทําให้แอปตัวอย่าง ซึ่งก็คือเว็บไซต์อีคอมเมิร์ซของ Fancy Store ใช้งานได้ เพื่อแสดงให้เห็นว่าเว็บไซต์สามารถทําให้ใช้งานได้และปรับขนาดได้อย่างง่ายดายด้วย Compute Engine

สิ่งที่คุณจะได้เรียนรู้

เมื่อสิ้นสุด Codelab คุณจะมีอินสแตนซ์ภายในกลุ่มอินสแตนซ์ที่มีการจัดการเพื่อให้บริการการซ่อมแซมอัตโนมัติ การจัดสรรภาระงาน การปรับขนาดอัตโนมัติ และการอัปเดตแบบต่อเนื่องสำหรับเว็บไซต์

ข้อกำหนดเบื้องต้น

2. การตั้งค่าสภาพแวดล้อม

การตั้งค่าสภาพแวดล้อมแบบเรียนรู้ด้วยตนเอง

  1. ลงชื่อเข้าใช้ Cloud Console แล้วสร้างโปรเจ็กต์ใหม่หรือใช้โปรเจ็กต์ที่มีอยู่ซ้ำ หากยังไม่มีบัญชี Gmail หรือ Google Workspace คุณต้องสร้างบัญชี

96a9c957bc475304.png

b9a10ebdf5b5a448.png

a1e3c01a38fa61c2.png

โปรดจดจำรหัสโปรเจ็กต์ ซึ่งเป็นชื่อที่ไม่ซ้ำกันในโปรเจ็กต์ Google Cloud ทั้งหมด (ชื่อด้านบนมีผู้ใช้แล้วและจะใช้ไม่ได้ ขออภัย) ซึ่งจะเรียกว่า PROJECT_ID ในภายหลังใน Codelab นี้

  1. จากนั้นคุณจะต้องเปิดใช้การเรียกเก็บเงินใน Cloud Console เพื่อใช้ทรัพยากร Google Cloud

การทำตาม Codelab นี้ไม่ควรมีค่าใช้จ่ายมากนัก หรืออาจไม่มีเลย โปรดทำตามวิธีการในส่วน "การล้างข้อมูล" ซึ่งจะแนะนำวิธีปิดทรัพยากรเพื่อไม่ให้มีการเรียกเก็บเงินนอกเหนือจากบทแนะนำนี้ ผู้ใช้ Google Cloud รายใหม่มีสิทธิ์เข้าร่วมโปรแกรมช่วงทดลองใช้ฟรีมูลค่า$300 USD

เปิดใช้ Compute Engine API

จากนั้นคุณต้องเปิดใช้ Compute Engine API การเปิดใช้ API กำหนดให้คุณต้องยอมรับข้อกำหนดในการให้บริการและความรับผิดชอบในการเรียกเก็บเงินสำหรับ API

ใน Cloud Shell ให้เรียกใช้คำสั่งต่อไปนี้เพื่อเปิดใช้ Compute Engine API

gcloud services enable compute.googleapis.com

Cloud Shell

แม้ว่าคุณจะใช้งาน Google Cloud จากแล็ปท็อปได้จากระยะไกล แต่ใน Codelab นี้ คุณจะได้ใช้ Cloud Shell ซึ่งเป็นสภาพแวดล้อมบรรทัดคำสั่งที่ทำงานในระบบคลาวด์

เครื่องเสมือนที่ใช้ Debian นี้มาพร้อมเครื่องมือพัฒนาทั้งหมดที่คุณต้องการ โดยมีไดเรกทอรีหลักแบบถาวรขนาด 5 GB และทำงานใน Google Cloud ซึ่งช่วยเพิ่มประสิทธิภาพเครือข่ายและการตรวจสอบสิทธิ์ได้อย่างมาก ซึ่งหมายความว่าคุณจะต้องมีเพียงเบราว์เซอร์เท่านั้นสำหรับโค้ดแล็บนี้ (ใช่แล้ว ใช้ได้ใน Chromebook)

  1. หากต้องการเปิดใช้งาน Cloud Shell จาก Cloud Console เพียงคลิกเปิดใช้งาน Cloud Shell a8460e837e9f5fda.png (ระบบจะใช้เวลาเพียงไม่กี่นาทีในการจัดสรรและเชื่อมต่อกับสภาพแวดล้อม)

b532b2f19ab85dda.png

Screen Shot 2017-06-14 at 10.13.43 PM.png

เมื่อเชื่อมต่อกับ Cloud Shell แล้ว คุณควรเห็นว่าระบบได้ตรวจสอบสิทธิ์คุณแล้ว และตั้งค่าโปรเจ็กต์เป็น PROJECT_ID แล้ว

gcloud auth list

เอาต์พุตของคำสั่ง

Credentialed accounts:
 - <myaccount>@<mydomain>.com (active)
gcloud config list project

เอาต์พุตของคำสั่ง

[core]
project = <PROJECT_ID>

หากไม่ได้ตั้งค่าโปรเจ็กต์ด้วยเหตุผลบางประการ ให้เรียกใช้คำสั่งต่อไปนี้

gcloud config set project <PROJECT_ID>

หากกำลังมองหา PROJECT_ID ตรวจสอบว่าคุณใช้รหัสใดในขั้นตอนการตั้งค่า หรือค้นหารหัสในแดชบอร์ด Cloud Console

2485e00c1223af09.png

นอกจากนี้ Cloud Shell ยังตั้งค่าตัวแปรสภาพแวดล้อมบางอย่างโดยค่าเริ่มต้น ซึ่งอาจมีประโยชน์เมื่อคุณเรียกใช้คำสั่งในอนาคต

echo $GOOGLE_CLOUD_PROJECT

เอาต์พุตของคำสั่ง

<PROJECT_ID>
  1. สุดท้าย ให้ตั้งค่าโซนเริ่มต้นและการกำหนดค่าโปรเจ็กต์
gcloud config set compute/zone us-central1-f

คุณเลือกโซนต่างๆ ได้หลากหลาย ดูข้อมูลเพิ่มเติมได้ที่ภูมิภาคและโซน

สร้าง Bucket ของ Cloud Storage

เราจะใช้ที่เก็บข้อมูล Cloud Storage เพื่อจัดเก็บโค้ดที่สร้างขึ้น รวมถึงสคริปต์เริ่มต้น ใน Cloud Shell ให้เรียกใช้คำสั่งต่อไปนี้เพื่อสร้างที่เก็บข้อมูล Cloud Storage ใหม่

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

3. โคลนที่เก็บซอร์ส

คุณจะใช้เว็บไซต์อีคอมเมิร์ซที่มีอยู่ของ Fancy Store ซึ่งอิงตามที่เก็บข้อมูลแบบ Monolith ไปยัง Microservices เป็นพื้นฐานสำหรับเว็บไซต์ คุณจะโคลนซอร์สโค้ดจากที่เก็บเพื่อให้มุ่งเน้นที่ด้านต่างๆ ของการติดตั้งใช้งานใน Compute Engine ได้ จากนั้นคุณจะอัปเดตโค้ดเล็กน้อยเพื่อแสดงให้เห็นว่าการอัปเดตใน Compute Engine นั้นง่ายเพียงใด

คุณโคลนที่เก็บโค้ดลงในโปรเจ็กต์โดยอัตโนมัติ รวมถึงเปิด Cloud Shell และโปรแกรมแก้ไขโค้ดในตัวได้ผ่านลิงก์ Open in Cloud Shell

หรือจะโคลนที่เก็บด้วยตนเองโดยใช้คำสั่งด้านล่างภายใน Cloud Shell ก็ได้

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

ที่พรอมต์คำสั่ง Cloud Shell ให้เรียกใช้บิลด์เริ่มต้นของโค้ดเพื่อให้แอปทำงานในเครื่องได้ สคริปต์อาจใช้เวลา 2-3 นาทีในการเรียกใช้

./setup.sh

โปรดตรวจสอบและทดสอบแอป เรียกใช้คำสั่งต่อไปนี้เพื่อเริ่มเว็บเซิร์ฟเวอร์

cd microservices
npm start

เอาต์พุต:

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

แสดงตัวอย่างแอปโดยคลิกไอคอนตัวอย่างเว็บ แล้วเลือก "แสดงตัวอย่างบนพอร์ต 8080"

6634c06dd0b9172c.png

ซึ่งควรจะเปิดหน้าต่างใหม่ที่คุณสามารถดูส่วนหน้าของ Fancy Store ได้

abf2ca314bf80d03.png

คุณปิดหน้าต่างนี้ได้หลังจากดูเว็บไซต์แล้ว หากต้องการหยุดกระบวนการเว็บเซิร์ฟเวอร์ ให้กด Control+C (Command+C ใน Macintosh) ในหน้าต่างเทอร์มินัล

4. สร้างอินสแตนซ์ Compute Engine

เมื่อมีสภาพแวดล้อมการพัฒนาที่ใช้งานได้แล้ว คุณก็สามารถติดตั้งใช้งานอินสแตนซ์ Compute Engine บางรายการได้ ในขั้นตอนต่อไปนี้ คุณจะทำสิ่งต่อไปนี้

  1. สร้างสคริปต์เริ่มต้นเพื่อกำหนดค่าอินสแตนซ์
  2. โคลนซอร์สโค้ดและอัปโหลดไปยัง Cloud Storage
  3. ติดตั้งใช้งานอินสแตนซ์ Compute Engine เพื่อโฮสต์ Microservice แบ็กเอนด์
  4. กำหนดค่าโค้ดส่วนหน้าใหม่เพื่อใช้ประโยชน์จากอินสแตนซ์ของไมโครเซอร์วิสแบ็กเอนด์
  5. ติดตั้งใช้งานอินสแตนซ์ Compute Engine เพื่อโฮสต์ไมโครเซอร์วิสส่วนหน้า
  6. กำหนดค่าเครือข่ายเพื่อให้สื่อสารได้

สร้างสคริปต์เริ่มต้น

ระบบจะใช้สคริปต์เริ่มต้นเพื่อสั่งให้อินสแตนซ์ทำอะไรทุกครั้งที่เริ่มทำงาน ด้วยวิธีนี้ ระบบจะกำหนดค่าอินสแตนซ์โดยอัตโนมัติ

คลิกไอคอนดินสอในริบบิ้น Cloud Shell เพื่อเปิดเครื่องมือแก้ไขโค้ด

ไปที่โฟลเดอร์ monolith-to-microservices คลิกไฟล์ > ไฟล์ใหม่ แล้วสร้างไฟล์ชื่อ startup-script.sh

439553c934139b82.png

ในไฟล์ใหม่ ให้วางโค้ดต่อไปนี้ ซึ่งคุณจะต้องแก้ไขบางส่วนหลังจากวาง

#!/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/v8.12.0/node-v8.12.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

ตอนนี้ในตัวแก้ไขโค้ด ให้ค้นหาข้อความ [DEVSHELL_PROJECT_ID] แล้วแทนที่ด้วยเอาต์พุตจากคำสั่งต่อไปนี้

echo $DEVSHELL_PROJECT_ID

ตัวอย่างเอาต์พุต

my-gce-codelab-253520

ตอนนี้บรรทัดโค้ดใน startup-script.sh ควรมีลักษณะคล้ายกับโค้ดต่อไปนี้

gs://fancy-store-my-gce-codelab-253520/monolith-to-microservices/microservices/* /fancy-store/

สคริปต์เริ่มต้นจะดำเนินการต่อไปนี้

  • การติดตั้งเอเจนต์ Logging ซึ่งจะรวบรวมบันทึกจาก Syslog โดยอัตโนมัติ
  • การติดตั้ง Node.js และ Supervisor ซึ่งจะเรียกใช้แอปเป็น Daemon
  • การโคลนซอร์สโค้ดของแอปจากที่เก็บข้อมูล Cloud Storage และการติดตั้งทรัพยากร Dependency
  • การกำหนดค่า Supervisor ซึ่งเรียกใช้แอปจะช่วยให้มั่นใจได้ว่าระบบจะรีสตาร์ทแอปหากแอปปิดโดยไม่คาดคิดหรือผู้ดูแลระบบหรือกระบวนการหยุดแอป และจะส่ง stdout และ stderr ของแอปไปยัง syslog เพื่อให้ตัวแทนการบันทึกรวบรวม

ตอนนี้ให้คัดลอกไฟล์ startup-script.sh ที่สร้างขึ้นไปยัง Bucket ของ Cloud Storage ที่คุณสร้างไว้ก่อนหน้านี้

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

ตอนนี้เข้าถึงได้ที่ https://storage.googleapis.com/[BUCKET_NAME]/startup-script.sh [BUCKET_NAME] แสดงชื่อของ Bucket ของ Cloud Storage โดยค่าเริ่มต้นจะมีเพียงผู้ใช้ที่ได้รับอนุญาตและบัญชีบริการเท่านั้นที่ดูได้ ดังนั้นจึงเข้าถึงผ่านเว็บเบราว์เซอร์ไม่ได้ อินสแตนซ์ Compute Engine จะเข้าถึงได้โดยอัตโนมัติผ่านบัญชีบริการของอินสแตนซ์

คัดลอกโค้ดไปยังที่เก็บข้อมูล Cloud Storage

เมื่ออินสแตนซ์เปิดตัว อินสแตนซ์จะดึงโค้ดจากที่เก็บข้อมูล Cloud Storage เพื่อให้คุณจัดเก็บตัวแปรการกำหนดค่าบางอย่างไว้ในไฟล์ ".env" ของโค้ดได้

คัดลอกโค้ดที่โคลนไปยัง Bucket ของ Cloud Storage โดยทำดังนี้

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

ทําให้อินสแตนซ์แบ็กเอนด์ใช้งานได้

อินสแตนซ์แรกที่คุณจะติดตั้งใช้งานคืออินสแตนซ์แบ็กเอนด์ ซึ่งจะโฮสต์ไมโครเซอร์วิสคำสั่งซื้อและผลิตภัณฑ์

เรียกใช้คำสั่งต่อไปนี้ใน Cloud Shell เพื่อสร้างอินสแตนซ์ f1-micro ที่กำหนดค่าให้ใช้สคริปต์เริ่มต้นที่คุณสร้างไว้ก่อนหน้านี้ และติดแท็กเป็นอินสแตนซ์แบ็กเอนด์เพื่อให้คุณใช้กฎไฟร์วอลล์ที่เฉพาะเจาะจงกับอินสแตนซ์นี้ได้ในภายหลัง

gcloud compute instances create backend \
    --machine-type=f1-micro \
    --image=debian-9-stretch-v20190905 \
    --image-project=debian-cloud \
    --tags=backend \
    --metadata=startup-script-url=https://storage.googleapis.com/fancy-store-$DEVSHELL_PROJECT_ID/startup-script.sh

กำหนดค่าการเชื่อมต่อกับแบ็กเอนด์

ก่อนที่จะติดตั้งใช้งานส่วนหน้าของแอป คุณต้องอัปเดตการกำหนดค่าให้ชี้ไปยังแบ็กเอนด์ที่คุณติดตั้งใช้งาน

เรียกที่อยู่ IP ภายนอกของแบ็กเอนด์ ซึ่งดูได้จากคำสั่งต่อไปนี้ในแท็บ EXTERNAL_IP สำหรับอินสแตนซ์แบ็กเอนด์

gcloud compute instances list

ตัวอย่างเอาต์พุต

NAME     ZONE           MACHINE_TYPE  PREEMPTIBLE  INTERNAL_IP  EXTERNAL_IP   STATUS
backend  us-central1-a  f1-micro                   10.128.0.2   34.68.223.88  RUNNING

ในโปรแกรมแก้ไขโค้ดของ Cloud Shell ให้ไปที่โฟลเดอร์ monolith-to-microservices > react-app จากเมนูโปรแกรมแก้ไขโค้ด ให้เลือกดู > สลับไฟล์ที่ซ่อนเพื่อดูไฟล์ .env

e7314ceda643e16.png

แก้ไขไฟล์ .env เพื่อชี้ไปยังที่อยู่ IP ภายนอกของแบ็กเอนด์ [BACKEND_ADDRESS] ด้านล่างแสดงถึงที่อยู่ IP ภายนอกของอินสแตนซ์แบ็กเอนด์ที่กำหนดจากคำสั่งก่อนหน้าในเครื่องมือ gcloud

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

บันทึกไฟล์

ใช้คำสั่งต่อไปนี้เพื่อสร้าง react-app ใหม่ ซึ่งจะอัปเดตโค้ดส่วนหน้า

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

คัดลอกรหัสแอปไปยัง Bucket ของ Cloud Storage โดยทำดังนี้

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

ทําให้อินสแตนซ์ฟรอนท์เอนด์ใช้งานได้

เมื่อกำหนดค่าโค้ดแล้ว คุณก็ทำให้อินสแตนซ์ฟรอนท์เอนด์ใช้งานได้ เรียกใช้คำสั่งต่อไปนี้เพื่อติดตั้งใช้งานอินสแตนซ์ส่วนหน้าด้วยคำสั่งที่คล้ายกับก่อนหน้า แต่อินสแตนซ์นี้จะได้รับการแท็กเป็น "ส่วนหน้า" เพื่อวัตถุประสงค์ของไฟร์วอลล์

gcloud compute instances create frontend \
    --machine-type=f1-micro \
    --image=debian-9-stretch-v20190905 \
    --image-project=debian-cloud \
    --tags=frontend \
    --metadata=startup-script-url=https://storage.googleapis.com/fancy-store-$DEVSHELL_PROJECT_ID/startup-script.sh 

กำหนดค่าเครือข่าย

สร้างกฎไฟร์วอลล์เพื่ออนุญาตการเข้าถึงพอร์ต 8080 สำหรับส่วนหน้า และพอร์ต 8081 และ 8082 สำหรับส่วนหลัง คำสั่งไฟร์วอลล์ใช้แท็กที่กำหนดในระหว่างการสร้างอินสแตนซ์สำหรับแอป

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

ตอนนี้เว็บไซต์ควรใช้งานได้แล้ว ตรวจสอบที่อยู่ IP ภายนอกของฟรอนท์เอนด์ คุณระบุที่อยู่ได้โดยค้นหา EXTERNAL_IP ของอินสแตนซ์ฟรอนท์เอนด์

gcloud compute instances list

ตัวอย่างเอาต์พุต

NAME      ZONE           MACHINE_TYPE  PREEMPTIBLE  INTERNAL_IP  EXTERNAL_IP      STATUS
backend   us-central1-a  f1-micro                   10.128.0.2   104.198.235.171  RUNNING
frontend  us-central1-a  f1-micro                   10.128.0.3   34.69.141.9      RUNNING

อินสแตนซ์อาจใช้เวลา 2-3 นาทีในการเริ่มต้นและกำหนดค่า เรียกใช้คำสั่งต่อไปนี้เพื่อตรวจสอบความพร้อมของแอป

watch -n 5 curl http://[EXTERNAL_IP]:8080 

เมื่อเห็นเอาต์พุตคล้ายกับตัวอย่างต่อไปนี้ เว็บไซต์ควรพร้อมใช้งาน กด Control+C (Command+C ใน Macintosh) ที่พรอมต์คำสั่งเพื่อยกเลิกคำสั่งของนาฬิกา

80dc8721dc08d7e4.png

ไปที่ http://[FRONTEND_ADDRESS]:8080 ด้วยแท็บเว็บเบราว์เซอร์ใหม่เพื่อเข้าถึงเว็บไซต์ โดย [FRONTEND_ADDRESS] คือ EXTERNAL_IP ที่กำหนดไว้ข้างต้น

ลองไปที่หน้าผลิตภัณฑ์และคำสั่งซื้อ ซึ่งควรใช้งานได้เช่นกัน

a11460a1fffb07d8.png

5. สร้างกลุ่มอินสแตนซ์ที่มีการจัดการ

ระบบจะสร้างกลุ่มอินสแตนซ์ที่มีการจัดการและใช้อินสแตนซ์ส่วนหน้าและส่วนหลังเป็นเทมเพลตอินสแตนซ์เพื่อให้แอปพลิเคชันของคุณปรับขนาดได้

กลุ่มอินสแตนซ์ที่มีการจัดการประกอบด้วยอินสแตนซ์ที่เหมือนกันซึ่งคุณจัดการเป็นเอนทิตีเดียวในโซนเดียวได้ กลุ่มอินสแตนซ์ที่มีการจัดการจะรักษาความพร้อมใช้งานสูงของแอปโดยการทำให้อินสแตนซ์พร้อมใช้งานอยู่เสมอ ซึ่งก็คืออยู่ในสถานะ RUNNING คุณจะใช้กลุ่มอินสแตนซ์ที่มีการจัดการสำหรับอินสแตนซ์ส่วนหน้าและส่วนหลังเพื่อให้บริการซ่อมแซมอัตโนมัติ การจัดสรรภาระงาน การปรับขนาดอัตโนมัติ และการอัปเดตแบบต่อเนื่อง

สร้างเทมเพลตอินสแตนซ์จากอินสแตนซ์ต้นทาง

ก่อนที่จะสร้างกลุ่มอินสแตนซ์ที่มีการจัดการได้ คุณต้องสร้างเทมเพลตอินสแตนซ์ที่จะเป็นพื้นฐานของกลุ่มก่อน เทมเพลตอินสแตนซ์ช่วยให้คุณกำหนดประเภทเครื่อง อิมเมจดิสก์บูทหรืออิมเมจคอนเทนเนอร์ เครือข่าย และพร็อพเพอร์ตี้อินสแตนซ์อื่นๆ ที่จะใช้เมื่อสร้างอินสแตนซ์เครื่องเสมือน (VM) ใหม่ได้ คุณสามารถใช้เทมเพลตอินสแตนซ์เพื่อสร้างอินสแตนซ์ในกลุ่มอินสแตนซ์ที่มีการจัดการ หรือแม้แต่สร้างอินสแตนซ์แต่ละรายการก็ได้

หากต้องการสร้างเทมเพลตอินสแตนซ์ ให้ใช้อินสแตนซ์ที่มีอยู่ซึ่งคุณสร้างไว้

ก่อนอื่น คุณต้องหยุดอินสแตนซ์ทั้ง 2 รายการ

gcloud compute instances stop frontend
gcloud compute instances stop backend

ตอนนี้ให้สร้างเทมเพลตอินสแตนซ์จากอินสแตนซ์ต้นทาง

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

ยืนยันว่ามีการสร้างเทมเพลตอินสแตนซ์แล้ว

gcloud compute instance-templates list

ตัวอย่างเอาต์พุต

NAME      MACHINE_TYPE  PREEMPTIBLE  CREATION_TIMESTAMP
fancy-be  f1-micro                   2019-09-12T07:52:57.544-07:00
fancy-fe  f1-micro                   2019-09-12T07:52:48.238-07:00

สร้างกลุ่มอินสแตนซ์ที่มีการจัดการ

คุณจะสร้างกลุ่มอินสแตนซ์ที่มีการจัดการ 2 กลุ่ม กลุ่มหนึ่งสำหรับฟรอนท์เอนด์ และอีกกลุ่มหนึ่งสำหรับแบ็กเอนด์ กลุ่มอินสแตนซ์ที่มีการจัดการเหล่านั้นจะใช้เทมเพลตอินสแตนซ์ที่สร้างไว้ก่อนหน้านี้ และได้รับการกำหนดค่าสำหรับอินสแตนซ์ 2 รายการในแต่ละกลุ่มเพื่อเริ่มต้น ระบบจะตั้งชื่ออินสแตนซ์โดยอัตโนมัติตาม "base-instance-name" ที่ระบุโดยมีอักขระแบบสุ่มต่อท้าย

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

สำหรับแอปพลิเคชันของคุณ Microservice ส่วนหน้าจะทำงานบนพอร์ต 8080 และ Microservice ส่วนหลังจะทำงานบนพอร์ต 8081 สำหรับคำสั่งซื้อและพอร์ต 8082 สำหรับผลิตภัณฑ์ เนื่องจากเป็นพอร์ตที่ไม่เป็นไปตามมาตรฐาน คุณจะต้องระบุพอร์ตที่มีชื่อเพื่อระบุพอร์ตเหล่านั้น พอร์ตที่มีชื่อคือข้อมูลเมตาคู่คีย์:ค่าที่แสดงชื่อบริการและพอร์ตที่บริการนั้นทำงานอยู่ คุณกำหนดพอร์ตที่มีชื่อให้กับกลุ่มอินสแตนซ์ได้ ซึ่งจะบ่งบอกว่าบริการพร้อมใช้งานในอินสแตนซ์ทั้งหมดในกลุ่ม ตัวจัดสรรภาระงานจะใช้ข้อมูลดังกล่าว ซึ่งคุณจะกำหนดค่าในภายหลัง

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

กำหนดค่าการซ่อมแซมอัตโนมัติ

หากต้องการปรับปรุงความพร้อมใช้งานของแอปและยืนยันว่าแอปตอบสนอง คุณสามารถกำหนดค่านโยบายการซ่อมแซมตัวเองสำหรับกลุ่มอินสแตนซ์ที่จัดการได้

นโยบายการซ่อมแซมตัวเองจะอาศัยการตรวจสอบประสิทธิภาพการทำงานที่อิงตามแอปเพื่อยืนยันว่าแอปตอบสนองตามที่คาดไว้ การตรวจสอบว่าแอปตอบสนองหรือไม่นั้นแม่นยำกว่าการยืนยันว่าอินสแตนซ์อยู่ในสถานะRUNNING ซึ่งเป็นลักษณะการทำงานเริ่มต้น

สร้างการตรวจสอบประสิทธิภาพการทำงานที่จะซ่อมแซมอินสแตนซ์หากอินสแตนซ์แสดงผลว่าไม่มีประสิทธิภาพ 3 ครั้งติดต่อกันสำหรับส่วนหน้าและส่วนหลัง

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

สร้างกฎไฟร์วอลล์เพื่ออนุญาตให้โพรบการตรวจสอบประสิทธิภาพการทำงานเชื่อมต่อกับ Microservice ในพอร์ต 8080 และ 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

ใช้การตรวจสอบประสิทธิภาพการทำงานกับบริการที่เกี่ยวข้อง

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

ทำตาม Codelab ต่อไปเพื่อให้เวลาการซ่อมแซมอัตโนมัติได้ตรวจสอบอินสแตนซ์ในกลุ่ม จากนั้นคุณจะจำลองความล้มเหลวเพื่อทดสอบการซ่อมแซมตัวเอง

6. สร้างตัวจัดสรรภาระงาน

เพื่อเสริมกลุ่มอินสแตนซ์ที่มีการจัดการ คุณจะต้องใช้การจัดสรรภาระงาน HTTP(S) เพื่อให้บริการการรับส่งข้อมูลไปยังไมโครเซอร์วิสส่วนหน้าและส่วนหลัง และใช้การแมปเพื่อส่งการรับส่งข้อมูลไปยังบริการแบ็กเอนด์ที่เหมาะสมตามกฎการกำหนดเส้นทาง ซึ่งจะแสดงที่อยู่ IP เดียวที่โหลดบาลานซ์สำหรับบริการทั้งหมด

ดูข้อมูลเพิ่มเติมเกี่ยวกับตัวเลือกการจัดสรรภาระงานที่มีใน Google Cloud ได้ที่ภาพรวมของการจัดสรรภาระงาน

สร้างการจัดสรรภาระงาน HTTP(S)

Google Cloud มีการจัดสรรภาระงานหลายประเภท แต่คุณจะใช้การจัดสรรภาระงาน HTTP(S) สำหรับการรับส่งข้อมูล การจัดสรรภาระงาน HTTP(S) มีโครงสร้างดังนี้

  1. กฎการส่งต่อจะนำคำขอขาเข้าไปยังพร็อกซี HTTP เป้าหมาย
  2. พร็อกซี HTTP เป้าหมายจะตรวจสอบคำขอแต่ละรายการกับแผนที่ URL เพื่อกำหนดบริการแบ็กเอนด์ที่เหมาะสมสำหรับคำขอ
  3. บริการแบ็กเอนด์จะส่งคำขอแต่ละรายการไปยังแบ็กเอนด์ที่เหมาะสมตามความจุในการแสดงผล โซน และสถานะอินสแตนซ์ของแบ็กเอนด์ที่แนบ ระบบจะยืนยันสถานะของอินสแตนซ์แบ็กเอนด์แต่ละรายการโดยใช้การตรวจสอบประสิทธิภาพการทำงานของ HTTP หากกำหนดค่าบริการแบ็กเอนด์ให้ใช้การตรวจสอบสถานะ HTTPS หรือ HTTP/2 ระบบจะเข้ารหัสคำขอระหว่างทางไปยังอินสแตนซ์แบ็กเอนด์
  4. เซสชันระหว่างตัวจัดสรรภาระงานกับอินสแตนซ์สามารถใช้โปรโตคอล HTTP, HTTPS หรือ HTTP/2 หากคุณใช้ HTTPS หรือ HTTP/2 แต่ละอินสแตนซ์ในบริการแบ็กเอนด์ต้องมีใบรับรอง SSL

สร้างการตรวจสอบประสิทธิภาพการทำงานที่จะใช้ในการพิจารณาว่าอินสแตนซ์ใดที่สามารถให้บริการการรับส่งข้อมูลสำหรับแต่ละบริการได้

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

สร้างบริการแบ็กเอนด์ที่เป็นเป้าหมายสำหรับการรับส่งข้อมูลที่โหลดบาลานซ์ บริการแบ็กเอนด์จะใช้การตรวจสอบประสิทธิภาพการทำงานและพอร์ตที่มีชื่อที่คุณสร้างขึ้น

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

เพิ่มบริการแบ็กเอนด์

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

สร้างแมป URL แผนที่ URL จะกำหนดว่า URL ใดจะนำไปยังบริการแบ็กเอนด์ใด

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

สร้างตัวเทียบเส้นทางเพื่อให้เส้นทาง /api/orders และ /api/products กำหนดเส้นทางไปยังบริการที่เกี่ยวข้องได้

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"

สร้างพร็อกซีที่เชื่อมโยงกับ URL Map ที่สร้างขึ้น

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

สร้างกฎการส่งต่อร่วมที่เชื่อมโยงที่อยู่ IP สาธารณะและพอร์ตกับพร็อกซี

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

อัปเดตการกำหนดค่า

ตอนนี้คุณมีที่อยู่ IP แบบคงที่ใหม่แล้ว คุณต้องอัปเดตโค้ดในส่วนหน้าให้ชี้ไปยังที่อยู่ใหม่แทนที่อยู่ชั่วคราวที่ใช้ก่อนหน้านี้ซึ่งชี้ไปยังอินสแตนซ์แบ็กเอนด์

ใน Cloud Shell ให้เปลี่ยนไปที่โฟลเดอร์ react-app ซึ่งมีไฟล์ .env ที่เก็บการกำหนดค่า

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

ค้นหาที่อยู่ IP สำหรับตัวจัดสรรภาระงาน

gcloud compute forwarding-rules list --global

ตัวอย่างเอาต์พุต

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

แก้ไขไฟล์ .env ด้วยเครื่องมือแก้ไขข้อความที่ต้องการ (เช่น GNU nano) เพื่อชี้ไปยังที่อยู่ IP สาธารณะของตัวจัดสรรภาระงาน [LB_IP] แสดงถึงที่อยู่ IP ภายนอกของอินสแตนซ์แบ็กเอนด์

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

สร้าง react-app อีกครั้ง ซึ่งจะอัปเดตโค้ดส่วนหน้า

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

คัดลอกโค้ดแอปพลิเคชันลงในที่เก็บข้อมูล GCS

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

อัปเดตอินสแตนซ์ฟรอนท์เอนด์

ตอนนี้คุณต้องการให้อินสแตนซ์ส่วนหน้าในกลุ่มอินสแตนซ์ที่มีการจัดการดึงโค้ดใหม่ อินสแตนซ์จะดึงโค้ดเมื่อเริ่มต้นระบบ คุณจึงออกคำสั่งรีสตาร์ทแบบต่อเนื่องได้

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

ทดสอบเว็บไซต์

รอประมาณ 30 วินาทีหลังจากออกคำสั่งรีสตาร์ทแบบต่อเนื่องเพื่อให้อินสแตนซ์มีเวลาประมวลผล จากนั้นตรวจสอบสถานะของกลุ่มอินสแตนซ์ที่มีการจัดการจนกว่าอินสแตนซ์จะปรากฏในรายการ

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

หลังจากรายการปรากฏในรายการแล้ว ให้ออกจากคำสั่ง watch โดยกด Control+C (Command+C ใน Macintosh)

ยืนยันว่าบริการแสดงเป็น "มีประสิทธิภาพดี"

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

ตัวอย่างเอาต์พุต

---
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

เมื่อรายการปรากฏในรายการแล้ว ให้ออกจากคำสั่ง watch โดยกด Control+C (Command+C ใน Macintosh)

จากนั้นจะเข้าถึงแอปพลิเคชันได้ผ่าน http://[LB_IP] โดยที่ [LB_IP] คือ IP_ADDRESS ที่ระบุสำหรับการจัดสรรภาระงาน ซึ่งดูได้ด้วยคำสั่งต่อไปนี้

gcloud compute forwarding-rules list --global

7. การปรับขนาด Compute Engine

ตอนนี้คุณได้สร้างกลุ่มอินสแตนซ์ที่มีการจัดการ 2 กลุ่ม โดยแต่ละกลุ่มมีอินสแตนซ์ 2 รายการ การกำหนดค่าทำงานได้อย่างสมบูรณ์ แต่เป็นการกำหนดค่าแบบคงที่โดยไม่คำนึงถึงโหลด ตอนนี้คุณจะสร้างนโยบายการปรับขนาดอัตโนมัติตามการใช้งานเพื่อปรับขนาดกลุ่มอินสแตนซ์ที่มีการจัดการแต่ละกลุ่มโดยอัตโนมัติ

ปรับขนาดโดยอัตโนมัติตามการใช้งาน

หากต้องการสร้างนโยบายการปรับขนาดอัตโนมัติ ให้เรียกใช้คำสั่งต่อไปนี้ใน Cloud Shell โดยจะสร้างโปรแกรมปรับขนาดอัตโนมัติในกลุ่มอินสแตนซ์ที่มีการจัดการซึ่งจะเพิ่มอินสแตนซ์โดยอัตโนมัติเมื่อตัวจัดสรรภาระงานมีการใช้งานสูงกว่า 60% และนำอินสแตนซ์ออกเมื่อตัวจัดสรรภาระงานมีการใช้งานต่ำกว่า 60%

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

เปิดใช้เครือข่ายนำส่งเนื้อหา

อีกฟีเจอร์หนึ่งที่ช่วยในการปรับขนาดได้คือการเปิดใช้ Cloud CDN ซึ่งเป็นบริการเครือข่ายนำส่งข้อมูลเพื่อให้บริการแคชสำหรับบริการส่วนหน้า หากต้องการดำเนินการดังกล่าว ให้เรียกใช้คำสั่งต่อไปนี้ในบริการส่วนหน้า

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

ตอนนี้เมื่อผู้ใช้ขอเนื้อหาจากตัวจัดสรรภาระงาน คำขอจะไปถึงส่วนหน้าของ Google ซึ่งจะค้นหาการตอบกลับคำขอของผู้ใช้ในแคชของ Cloud CDN ก่อน หากส่วนหน้าพบการตอบกลับที่แคชไว้ ก็จะส่งการตอบกลับที่แคชไว้ไปยังผู้ใช้ ซึ่งเรียกว่าการเข้าถึงแคช

ไม่เช่นนั้น หากส่วนหน้าไม่พบการตอบกลับที่แคชไว้สำหรับคำขอ ก็จะส่งคำขอไปยังแบ็กเอนด์โดยตรง หากการตอบกลับคำขอดังกล่าวแคชได้ ฟรอนต์เอนด์จะจัดเก็บการตอบกลับไว้ในแคช Cloud CDN เพื่อให้ใช้แคชสำหรับการตอบกลับคำขอที่ตามมาได้

8. อัปเดตเว็บไซต์

กำลังอัปเดตเทมเพลตอินสแตนซ์

แก้ไขเทมเพลตอินสแตนซ์ที่มีอยู่ไม่ได้ อย่างไรก็ตาม เนื่องจากอินสแตนซ์ของคุณไม่มีสถานะและมีการกำหนดค่าทั้งหมดผ่านสคริปต์เริ่มต้น คุณจึงต้องเปลี่ยนเทมเพลตอินสแตนซ์ก็ต่อเมื่อต้องการเปลี่ยนการตั้งค่าเทมเพลตของอิมเมจหลักเอง ตอนนี้คุณจะทำการเปลี่ยนแปลงอย่างง่ายเพื่อใช้ประเภทเครื่องที่ใหญ่ขึ้นและพุชการเปลี่ยนแปลงนั้น

อัปเดตอินสแตนซ์ฟรอนท์เอนด์ซึ่งทำหน้าที่เป็นพื้นฐานสำหรับเทมเพลตอินสแตนซ์ ในระหว่างการอัปเดต คุณจะวางไฟล์ในอิมเมจของเทมเพลตอินสแตนซ์เวอร์ชันที่อัปเดตแล้ว จากนั้นอัปเดตเทมเพลตอินสแตนซ์ เปิดตัวเทมเพลตใหม่ และยืนยันว่ามีไฟล์อยู่ในอินสแตนซ์ของกลุ่มอินสแตนซ์ที่มีการจัดการ

คุณจะแก้ไขประเภทเครื่องของเทมเพลตอินสแตนซ์โดยเปลี่ยนจากประเภทเครื่องมาตรฐาน f1-micro เป็นประเภทเครื่องที่กำหนดเองซึ่งมี vCPU 4 รายการและ RAM 3840MiB

ใน Cloud Shell ให้เรียกใช้คำสั่งต่อไปนี้เพื่อแก้ไขประเภทเครื่องของอินสแตนซ์ frontend

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

สร้างเทมเพลตอินสแตนซ์ใหม่

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

เปิดตัวเทมเพลตอินสแตนซ์ที่อัปเดตแล้วไปยังกลุ่มอินสแตนซ์ที่มีการจัดการ

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

ตรวจสอบสถานะการอัปเดต

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

เมื่อมีอินสแตนซ์มากกว่า 1 รายการในสถานะกำลังทำงาน โดยตั้งค่า ACTION เป็นไม่มี และตั้งค่า INSTANCE_TEMPLATE เป็นชื่อเทมเพลตใหม่ (fancy-fe-new) ให้คัดลอกชื่อเครื่องรายการใดรายการหนึ่งที่แสดงเพื่อใช้ในคำสั่งถัดไป

Control+S (Command+S ใน Macintosh) เพื่อออกจากการตรวจสอบ

เรียกใช้คำสั่งต่อไปนี้เพื่อดูว่าเครื่องเสมือนใช้ประเภทเครื่องใหม่ (custom-4-3840) หรือไม่ โดย [VM_NAME] คืออินสแตนซ์ที่สร้างขึ้นใหม่

gcloud compute instances describe [VM_NAME] | grep machineType

ตัวอย่างผลลัพธ์ที่คาดหวัง

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

ทำการเปลี่ยนแปลงเว็บไซต์

ทีมการตลาดขอให้คุณเปลี่ยนหน้าแรกของเว็บไซต์ โดยคิดว่าควรให้ข้อมูลเพิ่มเติมเกี่ยวกับบริษัทของคุณและสิ่งที่คุณขายจริง ในส่วนนี้ คุณจะเพิ่มข้อความบางอย่างลงในหน้าแรกเพื่อให้ทีมการตลาดพึงพอใจ ดูเหมือนว่านักพัฒนาแอปคนหนึ่งของคุณได้ทำการเปลี่ยนแปลงโดยใช้ชื่อไฟล์ index.js.new แล้ว คุณสามารถคัดลอกไฟล์ไปยัง index.js และการเปลี่ยนแปลงควรจะมีผล ทำตามวิธีการด้านล่างเพื่อทำการเปลี่ยนแปลงที่เหมาะสม

เรียกใช้คำสั่งต่อไปนี้ คัดลอกไฟล์ที่อัปเดตไปยังชื่อไฟล์ที่ถูกต้อง แล้วพิมพ์เนื้อหาเพื่อยืนยันการเปลี่ยนแปลง

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

โค้ดที่ได้ควรมีลักษณะดังนี้

/*
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>
  );
}

คุณอัปเดตคอมโพเนนต์ React แล้ว แต่ต้องสร้างแอป React เพื่อสร้างไฟล์แบบคงที่ เรียกใช้คำสั่งต่อไปนี้เพื่อสร้างแอป React และคัดลอกแอปไปยังไดเรกทอรีสาธารณะของ Monolith

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

จากนั้นพุชโค้ดไปยัง Bucket ของ Cloud Storage อีกครั้ง

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

ส่งการเปลี่ยนแปลงด้วยการอัปเดตทีละส่วน

ตอนนี้คุณสามารถบังคับให้ทุกอินสแตนซ์รีสตาร์ทเพื่อดึงข้อมูลอัปเดตได้แล้ว

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

รอประมาณ 30 วินาทีหลังจากออกคำสั่งรีสตาร์ทแบบต่อเนื่องเพื่อให้อินสแตนซ์มีเวลาประมวลผล จากนั้นตรวจสอบสถานะของกลุ่มอินสแตนซ์ที่มีการจัดการจนกว่าอินสแตนซ์จะปรากฏในรายการ

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

เมื่อรายการปรากฏในรายการแล้ว ให้ออกจากคำสั่ง watch โดยกด Control+S (Command+S ใน Macintosh)

เรียกใช้คำสั่งต่อไปนี้เพื่อยืนยันว่าบริการแสดงเป็นปกติ

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

ตัวอย่างเอาต์พุต

---
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

หลังจากรายการปรากฏในรายการแล้ว ให้ออกจากคำสั่ง watch โดยกด Control+S (Command+S ใน Macintosh)

หากต้องการล้างเนื้อหาที่แคชไว้ภายในเครือข่ายนำส่งข้อมูลและตรวจสอบว่ามีการแสดงเนื้อหาล่าสุด ให้เรียกใช้คำสั่งต่อไปนี้

gcloud compute url-maps invalidate-cdn-cache fancy-map \
    --path "/*"

ไปที่เว็บไซต์ผ่าน http://[LB_IP] โดยที่ [LB_IP] คือ IP_ADDRESS ที่ระบุสำหรับการจัดสรรภาระงาน ซึ่งดูได้ด้วยคำสั่งต่อไปนี้

gcloud compute forwarding-rules list --global

ตอนนี้คุณควรเห็นการเปลี่ยนแปลงใหม่ในเว็บไซต์แล้ว

b081b8e885bf0723.png

จำลองความล้มเหลว

หากต้องการยืนยันว่าการตรวจสอบประสิทธิภาพการทำงานใช้ได้ ให้เข้าสู่ระบบอินสแตนซ์และหยุดบริการ หากต้องการค้นหาชื่ออินสแตนซ์ ให้เรียกใช้คำสั่งต่อไปนี้

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

จากนั้น ให้ใช้ Secure Shell ไปยังอินสแตนซ์ใดอินสแตนซ์หนึ่ง โดยที่ INSTANCE_NAME คืออินสแตนซ์หนึ่งจากรายการ

gcloud compute ssh [INSTANCE_NAME]

ในอินสแตนซ์ ให้ใช้ supervisorctl เพื่อหยุดแอป

sudo supervisorctl stop nodeapp; sudo killall node

ออกจากอินสแตนซ์

exit

ตรวจสอบการดำเนินการซ่อม

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

มองหาเอาต์พุตตัวอย่างต่อไปนี้

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

หลังจากสังเกตเห็นการซ่อมแล้ว ให้กด Control+C (Command+S ใน Macintosh) เพื่อออกจากคำสั่ง watch ในขั้นตอนนี้ กลุ่มอินสแตนซ์ที่มีการจัดการจะสร้างอินสแตนซ์ขึ้นมาใหม่เพื่อซ่อมแซม

9. ล้างข้อมูล

เมื่อพร้อมแล้ว วิธีที่ง่ายที่สุดในการล้างกิจกรรมทั้งหมดที่ดำเนินการคือการลบโปรเจ็กต์ การลบโปรเจ็กต์จะลบตัวจัดสรรภาระงาน อินสแตนซ์ เทมเพลต และอื่นๆ ที่สร้างขึ้นระหว่างการทำโค้ดแล็บ เพื่อให้มั่นใจว่าจะไม่มีการเรียกเก็บเงินที่เกิดซ้ำโดยไม่คาดคิด เรียกใช้คำสั่งต่อไปนี้ใน Cloud Shell โดยที่ PROJECT_ID คือรหัสโปรเจ็กต์แบบเต็ม ไม่ใช่แค่ชื่อโปรเจ็กต์

gcloud projects delete [PROJECT_ID]

ยืนยันการลบโดยป้อน "Y" เมื่อได้รับข้อความแจ้ง

10. ยินดีด้วย

คุณได้ติดตั้งใช้งาน ปรับขนาด และอัปเดตเว็บไซต์ใน Compute Engine ตอนนี้คุณก็มีประสบการณ์การใช้งาน Compute Engine, กลุ่มอินสแตนซ์ที่มีการจัดการ, การจัดสรรภาระงาน และการตรวจสอบประสิทธิภาพการทำงานแล้ว