使用 Firebase 託管模擬器設計及測試網頁應用程式

開始使用 Firebase Hosting 模擬器製作原型及測試網頁應用程式前，請務必瞭解整體 Firebase Local Emulator Suite 工作流程，並安裝及設定 Local Emulator Suite，以及查看其 CLI 指令。

您也應該熟悉 Firebase Hosting 的功能和導入工作流程。建議您先參閱Firebase Hosting簡介。

Firebase Hosting模擬器有什麼用途？

Firebase Hosting 模擬器可提供 Hosting 服務的高擬真度本機模擬功能，並提供正式版 Hosting 的大部分功能。Hosting 模擬器可讓您：

• 製作靜態網站和網頁應用程式原型，無須支付儲存空間或存取費用
• 先測試及偵錯 HTTPS 函式，再部署至 Hosting 網站
• 在容器化持續整合工作流程中測試網站和網頁應用程式。

選擇 Firebase 專案

Firebase Local Emulator Suite 會模擬單一 Firebase 專案的產品。

如要選取要使用的專案，請先啟動模擬器，然後在工作目錄中執行 firebase use。或者，您也可以將 --project 標記傳遞至每個模擬器指令。

注意： 一般來說，最好為所有模擬器呼叫作業使用一個專案 ID，這樣 Emulator Suite UI、不同產品的模擬器，以及特定模擬器的所有執行中執行個體，才能在所有情況下正確通訊。事實上，Local Emulator Suite 預設會在偵測到多個使用的專案 ID 時發出警告，但您可以覆寫這項行為。如需設定及管理專案 ID 的指引，請參閱安裝與設定指南。

Local Emulator Suite 支援模擬實際 Firebase 專案和示範專案。

專案類型	功能	搭配模擬器使用
Real	您建立及設定的 Firebase 專案 (很可能透過 Firebase 控制台) 才是實際專案。 實際專案具有即時資源，例如資料庫執行個體、儲存空間值區、函式，或是您為該 Firebase 專案設定的任何其他資源。	使用實際的 Firebase 專案時，您可以為任何或所有支援的產品執行模擬器。 對於您未模擬的任何產品，應用程式和程式碼都會與實際資源 (資料庫執行個體、儲存空間 bucket、函式等) 互動。
示範	示範 Firebase 專案沒有實際 Firebase 設定，也沒有即時資源。這些專案通常透過程式碼研究室或其他教學課程存取。 示範專案的專案 ID 前置字串為 demo-。	使用 Firebase 示範專案時，您的應用程式和程式碼只會與模擬器互動。如果應用程式嘗試與未執行模擬器的資源互動，該程式碼就會失敗。

建議您盡可能使用範例專案。包括以下優點：

• 設定更簡單，因為您不必建立 Firebase 專案，就能執行模擬器
• 安全性更高，因為如果程式碼意外叫用非模擬 (正式) 資源，就不會發生資料變更、用量和帳單問題
• 離線支援功能更完善，因為您不需要存取網際網路即可下載 SDK 設定。

注意： 如要模擬跨服務互動 (例如資料庫觸發的 Cloud Functions 或 Rules，這類互動依賴 Authentication)，請務必確認程式碼中的專案 ID (位於 initializeApp() 等位置) 與 Firebase CLI 使用的專案 ID 相符。

核心原型設計工作流程

如果您要快速疊代處理，或是希望應用程式與模擬的後端專案資源互動，可以測試本機的 Hosting 內容和設定。在本機測試時，Firebase 會透過本機代管的網址提供網頁應用程式。

1. (選用) 根據預設，本機代管的應用程式會與實際 (而非模擬) 專案資源 (函式、資料庫、規則等) 互動。 您可以選擇將應用程式連線至您設定的任何模擬專案資源。瞭解詳情： Realtime Database | Cloud Firestore | Cloud Functions

2. 在本地專案目錄的根目錄中，執行下列指令：

   firebase emulators:start

3. 在 CLI 傳回的本機網址 (通常為 http://localhost:5000) 開啟網頁應用程式。

4. 如要更新本機網址，請重新整理瀏覽器。

使用其他本機裝置測試

根據預設，模擬器只會回應 localhost 的要求。也就是說，您可以使用電腦的網頁瀏覽器存取代管內容，但無法透過網路上的其他裝置存取。如要從其他本機裝置進行測試，請設定 firebase.json，如下所示：

"emulators": {
    // ...

    "hosting": {
      "port": 5000,
      "host": "0.0.0.0"
    }
  }

為持續整合工作流程產生驗證權杖

如果持續整合工作流程依賴 Firebase Hosting，您必須使用權杖登入，才能執行 firebase emulators:exec。其他模擬器則不需要登入。

注意： 如果您已在 firebase.json 中設定代管，但不需要在 CI 測試設定中使用，請使用 --only 標記 emulators:start 或 emulators:exec，只納入所需的模擬器。

如要產生權杖，請在本機環境中執行 firebase login:ci，請勿從持續整合系統執行這項操作。按照操作說明進行驗證。 每個專案只需要執行一次這個步驟，因為權杖在各個建構版本中都有效。請將權杖視為密碼，務必嚴格保密。

如果 CI 環境允許您指定可在建構指令碼中使用的環境變數，只要建立名為 FIREBASE_TOKEN 的環境變數，並將存取權杖字串設為該變數的值即可。Firebase CLI 會自動擷取 FIREBASE_TOKEN 環境變數，模擬器也會正常啟動。

最後，您也可以直接在建構指令碼中加入權杖，但請務必確保不受信任的第三方無法存取。如要採用這種硬式編碼方法，請將 --token "YOUR_TOKEN_STRING_HERE" 新增至 firebase emulators:exec 指令。

後續步驟

• 按照 Firebase 網頁 Codelab 的說明，使用 Hosting 模擬器執行快速入門導覽課程。
• 瞭解如何使用 Hosting 模擬器，按照函式代管指南中的說明，製作 HTTPS 函式原型。
• 如需一系列精選影片和詳細使用說明範例，請觀看 Firebase 模擬器訓練播放清單。