firebase-app-hosting-basics

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

App Hosting Basics

App Hosting 基础

Description

描述

This skill enables the agent to deploy and manage modern, full-stack web applications (Next.js, Angular, etc.) using Firebase App Hosting.
Important: In order to use App Hosting, your Firebase project must be on the Blaze pricing plan. Direct the user to https://console.firebase.google.com/project/_/overview?purchaseBillingPlan=metered to upgrade their plan.
此技能支持Agent使用Firebase App Hosting部署和管理现代全栈Web应用(Next.js、Angular等)。
重要提示:要使用App Hosting,您的Firebase项目必须采用Blaze付费方案。请引导用户访问https://console.firebase.google.com/project/_/overview?purchaseBillingPlan=metered升级其方案。

Hosting vs App Hosting

Hosting 与 App Hosting 对比

Choose Firebase Hosting if:
  • You are deploying a static site (HTML/CSS/JS).
  • You are deploying a simple SPA (React, Vue, etc. without SSR).
  • You want full control over the build and deploy process via CLI.
Choose Firebase App Hosting if:
  • You are using a supported full-stack framework like Next.js or Angular.
  • You need Server-Side Rendering (SSR) or ISR.
  • You want an automated "git push to deploy" workflow with zero configuration.
选择Firebase Hosting的场景
  • 您部署的是静态网站(HTML/CSS/JS)。
  • 您部署的是简单的单页应用(React、Vue等,无SSR)。
  • 您希望通过CLI完全控制构建和部署流程。
选择Firebase App Hosting的场景
  • 您使用受支持的全栈框架,如Next.js或Angular。
  • 您需要服务器端渲染(SSR)或增量静态再生(ISR)。
  • 您想要无需配置的自动化「git push 部署」工作流。

Deploying to App Hosting

部署到App Hosting

Deploy from Source

从源代码部署

This is the recommended flow for most users.
  1. Configure
    firebase.json
    with an
    apphosting
    block.
    json
    {
      "apphosting": {
        "backendId": "my-app-id",
        "rootDir": "/",
        "ignore": [
          "node_modules",
          ".git",
          "firebase-debug.log",
          "firebase-debug.*.log",
          "functions"
        ]
      }
    }
  2. Create or edit
    apphosting.yaml
    - see Configuration for more information on how to do so.
  3. If the app needs safe access to sensitive keys, use
    npx -y firebase-tools@latest apphosting:secrets
    commands to set and grant access to secrets.
  4. Run
    npx -y firebase-tools@latest deploy
    when you are ready to deploy.
这是大多数用户推荐的流程。
  1. firebase.json
    中配置
    apphosting
    块。
    json
    {
      "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
    进行部署。

Automated deployment via GitHub (CI/CD)

通过GitHub实现自动化部署(CI/CD)

Alternatively, set up a backend connected to a GitHub repository for automated deployments "git push" deployments. This is only recommended for more advanced users, and is not required to use App Hosting. See CLI Commands for more information on how to set this up using CLI commands.
或者,设置一个连接到GitHub仓库的后端,实现「git push 部署」的自动化部署。这仅推荐给更高级的用户,并非使用App Hosting的必需步骤。有关如何使用CLI命令设置的更多信息,请参阅CLI命令

Emulation

本地模拟

See Emulation for more information on how to test your app locally using the Firebase Local Emulator Suite.
有关如何使用Firebase Local Emulator Suite在本地测试应用的更多信息,请参阅本地模拟