实验设置说明和要求
保护您的账号和进度。请务必在无痕浏览器窗口中,使用实验凭证运行此实验。

透過 Google Cloud 建構網站:挑戰實驗室

实验 25 分钟 universal_currency_alt 5 积分 show_chart 中级
info 此实验可能会提供 AI 工具来支持您学习。
此内容尚未针对移动设备进行优化。
为获得最佳体验,请在桌面设备上访问通过电子邮件发送的链接。

GSP319

Google Cloud 自學實驗室標誌

簡介

在挑戰研究室中,您會在特定情境下完成一系列任務。挑戰研究室不會提供逐步說明,您將運用從課程研究室學到的技巧,自行找出方法完成任務!自動評分系統 (如本頁所示) 將根據您是否正確完成任務來提供意見回饋。

在您完成任務的期間,挑戰研究室不會介紹新的 Google Cloud 概念。您須靈活運用所學技巧,例如變更預設值或詳讀並研究錯誤訊息,解決遇到的問題。

若想滿分達標,就必須在時限內成功完成所有任務!

這個實驗室適合「透過 Google Cloud 建構網站」課程的學員。準備迎接挑戰了嗎?

設定和需求

瞭解以下事項後,再點選「Start Lab」按鈕

請詳閱以下操作說明。實驗室活動會計時,且中途無法暫停。點選「Start Lab」後就會開始計時,顯示可使用 Google Cloud 資源的時間。

您將在真正的雲端環境完成實作實驗室活動,而不是模擬或示範環境。為此,我們會提供新的暫時憑證,供您在實驗室活動期間登入及存取 Google Cloud。

為了順利完成這個實驗室,請先確認:

  • 可以使用標準的網際網路瀏覽器 (Chrome 瀏覽器為佳)。
注意事項:請使用無痕模式 (建議選項) 或私密瀏覽視窗執行此實驗室,這可以防止個人帳戶和學員帳戶之間的衝突,避免個人帳戶產生額外費用。
  • 是時候完成實驗室活動了!別忘了,活動一旦開始將無法暫停。
注意事項:務必使用實驗室專用的學員帳戶。如果使用其他 Google Cloud 帳戶,可能會產生額外費用。

挑戰情境

您剛在 FancyStore, Inc. 擔任新職務。

您的任務是將公司現有的單體式電子商務網站,拆分成邏輯上彼此獨立的一系列微服務。現有的單體式程式碼位於 GitHub 存放區,您需要將這個應用程式容器化並重構。

公司認為您具備執行這些工作所需的技能與知識,因此不會提供逐步指南。

前一個團隊因為負責單體式架構而過勞,已另謀高就 (他們現在經營薰衣草農場),因此上級要求您帶領這個團隊。您必須負責擷取原始碼、使用原始碼建構容器 (有位農夫留下一個 Dockerfile),然後將容器推送至 GKE。

首先,請建構、部署及測試單體式架構,確保原始碼沒有問題,接著將組成服務一一拆分成微服務 Deployment。

請務必遵守 FancyStore, Inc. 公司的標準,包括:

  • 建立叢集。
  • 名稱格式通常是「團隊-資源」,例如執行個體可命名為 fancystore-orderservice1
  • 分配的資源多寡應符合成本效益。專案會受到監控。如果超量使用資源,該項資源所屬的專案就會終止。
  • 如未特別指定,請使用 e2-medium 機型。

您的挑戰

您坐在桌前開啟新筆電,收到完成下列工作的要求。祝一切順利!

工作 1:下載單體式程式碼並建構容器

  1. 登入新專案並啟用 Cloud Shell。

  2. 首先,請複製團隊的 Git 存放區。專案的根目錄中有個「setup.sh」指令碼,您需要執行這個指令碼來建構單體式容器。

  3. 依序執行 setup.sh 指令碼和下列指令,確認 Cloud Shell 執行的是最新版 nodeJS:

nvm install --lts

您可以建構並推送幾個不同的專案。

  1. 將單體式應用程式版本 (剛好就放在 monolith 目錄) 推送至 Artifact Registry。~/monotlith-to-microservices/monolith 資料夾中有一個 Dockerfile,可用來建構應用程式容器。

  2. 建構時,必須在該單體式資料夾執行 Cloud Build,然後將容器推送至 Artifact Registry。

  3. 構件命名如下:

    • 存放區:gcr.io/${GOOGLE_CLOUD_PROJECT}
    • 映像檔名稱:
    • 映像檔版本:1.0.0

點選「Check my progress」,確認目標已達成。 下載單體式程式碼並建構容器

工作 2:建立 Kubernetes 叢集並部署應用程式

建立好的映像檔已儲存在 Artifact Registry,接著要建立叢集來部署映像檔。

公司要求將所有資源部署在 可用區,因此您需要先為該可用區建立 GKE 叢集。首先,請建立 3 個節點的叢集。

  1. 根據下列設定建立叢集:

    • 叢集名稱:
    • 區域:
    • 節點數:3

成功建構映像檔並啟動叢集後,現在可以部署應用程式了。

請將建構的映像檔部署至叢集,就能啟動並執行應用程式。不過,如果想開放外部存取,必須公開應用程式。團隊成員提到,應用程式在通訊埠 8080 執行,但您需要公開至通訊埠 80,使用者會更方便取用。

  1. 根據下列設定建立及公開 Deployment:

    • 叢集名稱:
    • 容器名稱:
    • 容器版本:1.0.0
    • 應用程式通訊埠:8080
    • 可從外部存取的通訊埠:80
注意:在這個實驗室,服務公開程序經過簡化,平常應該是使用 API 閘道來保護公開端點。如要進一步瞭解最佳做法,請參閱《微服務最佳做法指南》。
  1. 記下公開 Deployment 作業指派的 IP 位址。現在,您應該能順利從瀏覽器前往這個 IP 位址了!

畫面應顯示如下:

Fancy Store 網頁

點選「Check my progress」,確認目標已達成。 建立 Kubernetes 叢集並部署應用程式

建構及部署完 Fancy Store 的單體式應用程式後,接著要開始拆分成微服務。

將單體式應用程式遷移至微服務

您已在 GKE 執行現有的單體式網站,現在可以著手將各項服務拆分成微服務。一般來說,規劃重點是判斷要將哪些服務拆得更小,這通常會根據應用程式的特定部分 (例如業務領域) 來決定。

為方便進行這項挑戰,讓我們快轉一下,假設您已成功將單體式應用程式拆分成一系列微服務:Orders、Products 和 Frontend。程式碼準備好了,現在要開始部署服務。

工作 3:建立新的微服務

目前有三項服務需要拆分成各自的容器。您要將所有服務移至容器,因此必須追蹤下列各項服務的資訊:

  • 服務的根資料夾 (建構容器的位置)
  • 容器上傳後的存放區
  • 容器構件的名稱和版本

建立微服務的容器化版本

以下是需要容器化的服務。

  1. 前往下方提及的來源根目錄,將建立的構件和指定的中繼資料,一併上傳至 Artifact Registry:

Orders 微服務

服務根資料夾:~/monolith-to-microservices/microservices/src/orders

GCR 存放區:gcr.io/${GOOGLE_CLOUD_PROJECT}

映像檔名稱:

映像檔版本:1.0.0

Products 微服務

服務根資料夾:~/monolith-to-microservices/microservices/src/products

GCR 存放區:gcr.io/${GOOGLE_CLOUD_PROJECT}

映像檔名稱:

映像檔版本:1.0.0

  1. 容器化微服務,並將映像檔上傳至 Artifact Registry 後,就能部署並公開這些服務。

點選「Check my progress」,確認目標已達成。 建立 Orders 和 Products 微服務的容器化版本

工作 4:部署新的微服務

請按照部署 單體式應用程式時的程序,部署這些新容器。提醒您,這些服務監聽的通訊埠各不相同,務必記錄下表中的通訊埠對應。

  1. 根據下列設定建立及公開 Deployment:

Orders 微服務

叢集名稱:

容器名稱:

容器版本:1.0.0

應用程式通訊埠:8081

可從外部存取的通訊埠:80

Products 微服務

叢集名稱:

容器名稱:

容器版本:1.0.0

應用程式通訊埠:8082

可從外部存取的通訊埠:80

注意:請記下 Orders 和 Products 服務公開後的 IP 位址,後續步驟會用到。
  1. 您可以透過瀏覽器前往下列網址,確認部署成功,而且服務已公開:

    • http://ORDERS_EXTERNAL_IP/api/orders
    • http://PRODUCTS_EXTERNAL_IP/api/products

如果部署成功,每項服務都會傳回 JSON 字串。

點選「Check my progress」,確認目標已達成。 部署新的微服務

工作 5:設定及部署 Frontend 微服務

您已擷取 Orders 和 Products 微服務,再來需要將 Frontend 服務設為指向這兩項微服務,然後完成部署。

重新設定 Frontend

  1. 使用 nano 編輯器,將本機網址替換為新 Products 微服務的 IP 位址:
cd ~/monolith-to-microservices/react-app nano .env

開啟編輯器後,檔案應如下所示。

輸出結果:

REACT_APP_ORDERS_URL=http://localhost:8081/api/orders REACT_APP_PRODUCTS_URL=http://localhost:8082/api/products
  1. REACT_APP_PRODUCTS_URL 改成新格式,然後將 Orders 和 Products 微服務 IP 位址替換為以下內容:
REACT_APP_ORDERS_URL=http://<ORDERS_IP_ADDRESS>/api/orders REACT_APP_PRODUCTS_URL=http://<PRODUCTS_IP_ADDRESS>/api/products
  1. 依序按下 CTRL+O 鍵、ENTER 鍵和 CTRL+X 鍵,在 nano 編輯器儲存檔案。

  2. 接著執行下列指令,重新建構 Frontend 應用程式,再將其容器化:

npm run build

工作 6:建立 Frontend 微服務的容器化版本

現在 Orders 和 Products 微服務已容器化並完成部署,Frontend 服務也已設為指向這些微服務,最後一步就是部署容器化的 Frontend。

請使用 Cloud Build 封裝 Frontend 服務的內容,然後推送至 Artifact Registry,如下所示:

  • 服務根資料夾:~/monolith-to-microservices/microservices/src/frontend
  • 存放區:gcr.io/${GOOGLE_CLOUD_PROJECT}
  • 映像檔名稱:
  • 映像檔版本:1.0.0

這項程序可能需要幾分鐘,請耐心等候。

點選「Check my progress」,確認目標已達成。 建立 Frontend 微服務的容器化版本

工作 7:部署 Frontend 微服務

請按照部署「Orders」和「Products」微服務時的程序,部署這個容器。

  1. 根據下列設定建立及公開 Deployment:

    • 叢集名稱:
    • 容器名稱:
    • 容器版本:1.0.0
    • 應用程式通訊埠:8080
    • 可從外部存取的通訊埠:80
  2. 您可以透過瀏覽器前往 Frontend 服務的 IP 位址,確認部署成功,微服務也已正確公開。

畫面上應該會顯示 Fancy Store 首頁,當中有導向 Products 和 Orders 頁面的連結。這些頁面是由您新建的微服務支援。

點選「Check my progress」,確認目標已達成。 部署 Frontend 微服務

恭喜!

Build_a_Website_on_Google_Cloud_Skill_WBG.png

Google Cloud 教育訓練與認證

協助您瞭解如何充分運用 Google Cloud 的技術。我們的課程會介紹專業技能和最佳做法,讓您可以快速掌握要領並持續進修。我們提供從基本到進階等級的訓練課程,並有隨選、線上和虛擬課程等選項,方便您抽空參加。認證可協助您驗證及證明自己在 Google Cloud 技術方面的技能和專業知識。

使用手冊上次更新日期:2026 年 3 月 10 日

實驗室上次測試日期:2026 年 3 月 10 日

Copyright 2026 Google LLC 保留所有權利。Google 和 Google 標誌是 Google LLC 的商標,其他公司和產品名稱則有可能是其關聯公司的商標。

准备工作

  1. 实验会创建一个 Google Cloud 项目和一些资源,供您使用限定的一段时间
  2. 实验有时间限制,并且没有暂停功能。如果您中途结束实验,则必须重新开始。
  3. 在屏幕左上角,点击开始实验即可开始

使用无痕浏览模式

  1. 复制系统为实验提供的用户名密码
  2. 在无痕浏览模式下,点击打开控制台

登录控制台

  1. 使用您的实验凭证登录。使用其他凭证可能会导致错误或产生费用。
  2. 接受条款,并跳过恢复资源页面
  3. 除非您已完成此实验或想要重新开始,否则请勿点击结束实验,因为点击后系统会清除您的工作并移除该项目

此内容目前不可用

一旦可用,我们会通过电子邮件告知您

太好了!

一旦可用,我们会通过电子邮件告知您

一次一个实验

确认结束所有现有实验并开始此实验

使用无痕浏览模式运行实验

使用无痕模式或无痕浏览器窗口是运行此实验的最佳方式。这可以避免您的个人账号与学生账号之间发生冲突,这种冲突可能导致您的个人账号产生额外费用。