THE3RDTRAINER/Homepage

App Hosting 基礎

描述

此技能讓代理能夠使用 Firebase App Hosting 部署和管理現代化、全端網頁應用程式（Next.js、Angular 等）。

重要事項：若要使用 App Hosting，您的 Firebase 專案必須採用 Blaze 計費方案。請引導使用者前往 https://console.firebase.google.com/project/_/overview?purchaseBillingPlan=metered 升級方案。

代管 vs App Hosting

當以下情況時，請選擇 Firebase 代管：

• 您要部署靜態網站（HTML/CSS/JS）。
• 您要部署簡單的單頁應用程式（SPA，例如 React、Vue，但無 SSR）。
• 您希望透過 CLI 完全掌控建置與部署流程。

當以下情況時，請選擇 Firebase App Hosting：

• 您使用支援的全端框架，例如 Next.js 或 Angular。
• 您需要伺服器端渲染（SSR）或增量靜態生成（ISR）。
• 您想要一個自動化、零設定的「git push 即可部署」工作流程。

部署至 App Hosting

從原始碼部署

這是大多數使用者建議的流程。

1. 在 firebase.json 中設定 apphosting 區塊。

   {
     "apphosting": {
       "backendId": "my-app-id",
       "rootDir": "/",
       "ignore": [
         "node_modules",
         ".git",
         "firebase-debug.log",
         "firebase-debug.*.log",
         "functions"
       ]
     }
   }
   

2. 建立或編輯 apphosting.yaml，更多資訊請參閱設定。

3. 若應用程式需要安全存取敏感金鑰，請使用 npx -y firebase-tools@latest apphosting:secrets 命令設定並授予機密存取權。

4. 準備部署時，執行 npx -y firebase-tools@latest deploy。

透過 GitHub 自動化部署（CI/CD）

或者，設定一個連接到 GitHub 儲存庫的後端，以實現「git push」自動化部署。此方法僅建議進階使用者使用，且並非使用 App Hosting 的必要條件。有關如何透過 CLI 命令進行設定的更多資訊，請參閱CLI 命令。

模擬

如需更多關於使用 Firebase 本機模擬器套件在本機測試應用程式的資訊，請參閱模擬。