โฮสต์และปรับขนาดเว็บแอปใน 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 ทั้งหมด (ชื่อด้านบนมีคนใช้แล้ว และจะใช้ไม่ได้ ขออภัย) และจะมีการอ้างอิงใน Codelab ว่า PROJECT_ID ในภายหลัง

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

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

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

b532b2f19ab85dda.png

Screen Shot 14-06-2017 เวลา 22.13.43 น.

เมื่อเชื่อมต่อกับ 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

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

สร้างที่เก็บข้อมูล Cloud Storage

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

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

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

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

คุณสามารถโคลนที่เก็บโค้ดลงในโปรเจ็กต์โดยอัตโนมัติได้ รวมถึงเปิด Cloud Shell และตัวแก้ไขโค้ดในตัวผ่านลิงก์ต่อไปนี้: เปิดใน 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. โปรดกำหนดค่าโค้ดฟรอนท์เอนด์อีกครั้งเพื่อใช้อินสแตนซ์ Microservice แบ็กเอนด์
  5. ทำให้อินสแตนซ์ Compute Engine ใช้งานได้เพื่อโฮสต์ Microservice ฟรอนท์เอนด์
  6. กำหนดค่าเครือข่ายเพื่ออนุญาตให้สื่อสารกันได้

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

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

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

ไปที่โฟลเดอร์ monolith-to-microservices คลิกไฟล์ > ไฟล์ใหม่ แล้วสร้างไฟล์ชื่อ start-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 Agent ซึ่งจะรวบรวมบันทึกจาก Syslog โดยอัตโนมัติ
  • การติดตั้ง Node.js และ Supervisor ซึ่งเรียกใช้แอปในฐานะ Daemon
  • การโคลนซอร์สโค้ดของแอปจากที่เก็บข้อมูล Cloud Storage และการติดตั้งทรัพยากร Dependency
  • การกำหนดค่าผู้ดูแลซึ่งเรียกใช้แอป ตรวจสอบว่าได้รีสตาร์ทแอปหากออกจากการทำงานโดยไม่คาดคิดหรือถูกหยุดโดยผู้ดูแลระบบหรือโปรเซส และส่ง Stdout และ Stderr ของแอปไปยัง syslog เพื่อให้ Agent ของ Logging รวบรวม

ตอนนี้ให้คัดลอกไฟล์ start-script.sh ที่สร้างขึ้นไปไว้ในที่เก็บข้อมูล 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] แทนชื่อของที่เก็บข้อมูล Cloud Storage ซึ่งโดยค่าเริ่มต้นแล้ว จะมีเพียงผู้ใช้ที่ได้รับอนุญาตและบัญชีบริการเท่านั้นที่ดูได้ ดังนั้นจึงไม่สามารถเข้าถึงได้ผ่านเว็บเบราว์เซอร์ อินสแตนซ์ Compute Engine จะเข้าถึงอินสแตนซ์ดังกล่าวได้โดยอัตโนมัติผ่านบัญชีบริการ

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

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

คัดลอกโค้ดที่โคลนลงในที่เก็บข้อมูล Cloud Storage ด้วยคำสั่งต่อไปนี้

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

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

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

เรียกใช้คำสั่งต่อไปนี้ใน 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

บันทึกไฟล์

ใช้คำสั่งต่อไปนี้เพื่อสร้างรีแอ็กชันแอปอีกครั้ง ซึ่งจะอัปเดตโค้ดฟรอนท์เอนด์

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

คัดลอกโค้ดแอปลงในที่เก็บข้อมูล 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. สร้างกลุ่มอินสแตนซ์ที่มีการจัดการ

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

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

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

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

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

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

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 อินสแตนซ์ในแต่ละกลุ่มเพื่อเริ่มต้น ระบบจะตั้งชื่ออินสแตนซ์โดยอัตโนมัติตาม "ชื่ออินสแตนซ์พื้นฐาน" ที่ระบุโดยมีอักขระแบบสุ่มต่อท้าย

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

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

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

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

สร้างการตรวจสอบประสิทธิภาพการทำงานที่จะซ่อมแซมอินสแตนซ์หากอินสแตนซ์แสดงผลมีประสิทธิภาพไม่ดี 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) เพื่อแสดงการรับส่งข้อมูลไปยัง Microservice ฟรอนท์เอนด์และแบ็กเอนด์ และใช้การแมปเพื่อส่งการจราจรของข้อมูลไปยังบริการแบ็กเอนด์ที่เหมาะสมตามกฎเส้นทาง ซึ่งจะแสดงที่อยู่ 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 ที่สร้าง

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 ให้เปลี่ยนโฟลเดอร์แอปรีแอ็กชัน ซึ่งเก็บไฟล์ .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

สร้างแอปรีแอ็กชันใหม่ ซึ่งจะอัปเดตโค้ดฟรอนท์เอนด์

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 วินาทีหลังจากออกคำสั่ง rolling-action continue เพื่อให้เวลาประมวลผลอินสแตนซ์ จากนั้นตรวจสอบสถานะของกลุ่มอินสแตนซ์ที่มีการจัดการจนกว่าอินสแตนซ์จะปรากฏในรายการ

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

หลังจากที่รายการปรากฏในรายการ ให้ออกจากคำสั่งนาฬิกาโดยการกด 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 ซึ่งเป็นบริการเครือข่ายนำส่งข้อมูล (CDN) เพื่อให้บริการแคชสำหรับบริการฟรอนท์เอนด์ โดยใช้คำสั่งต่อไปนี้ในบริการฟรอนท์เอนด์

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

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

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

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

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

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

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

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

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

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 อินสแตนซ์ที่อยู่ในสถานะ RUNNING ให้ตั้งค่า ACTION เป็น None และตั้งค่าให้ 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 และคัดลอกไปยังไดเรกทอรีสาธารณะแบบโมโนลิธ

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

จากนั้นพุชโค้ดไปยังที่เก็บข้อมูล 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

เมื่อรายการปรากฏในรายการ ให้ออกจากคำสั่งนาฬิกาโดยการกด 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

หลังจากที่รายการปรากฏในรายการ ให้ออกจากคำสั่งนาฬิกาโดยการกด Control+S (Command+S บน Macintosh)

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

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]

ในกรณีนี้ ให้ใช้การควบคุมดูแลเพื่อหยุดแอป

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) เพื่อออกจากคำสั่งนาฬิกา ในจุดนี้ อินสแตนซ์ที่มีการจัดการจะสร้างอินสแตนซ์ขึ้นมาใหม่เพื่อซ่อมแซม

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

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

gcloud projects delete [PROJECT_ID]

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

10. ยินดีด้วย

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