Firebase Hosting 是 Google Firebase 平台里的静态 + 边缘层。它把文件分发到全球 CDN，自动配好免费 SSL，并能和 Firebase 的 Auth、Firestore、Cloud Functions 联动。它不是 Vercel 那种 Next.js 运行时，把它当 Next.js host 用是新手踩坑的主要原因。截至 2026 年 6 月，它还多了一个兄弟产品 Firebase App Hosting，专门为服务端渲染框架而生，所以你要做的第一个决定，是这两个里到底该用哪个。下面给出心智模型、免费额度数字、基础 firebase.json 和上线命令。
一句话总结
- Firebase Hosting = 全球 CDN 上的静态文件 + SPA，免费 SSL，免费档不需要绑定结算账户。适合纯静态 HTML、Astro/Vite 静态构建、单页应用。
- Firebase App Hosting = 给 SSR 框架（Next.js、Angular）准备的新产品。需要 Blaze 结算账户；CDN、构建、服务端渲染一并托管。
- 截至 2026 年 6 月，免费（Spark）额度：10 GB 存储 + 每月 10 GB 流量，无需信用卡。
- 输出是一堆文件就选 Hosting；需要真正的每请求 SSR 就选 App Hosting；想要最省心的零配置 Next.js 体验就选 Vercel。
Firebase Hosting 与 Firebase App Hosting
2026 年初之前，在 Firebase 上做服务端渲染的唯一办法，是通过 rewrite 把 Cloud Functions 或 Cloud Run 接到 Firebase Hosting 上。这套现在仍然能用，但 Google 已经把 SSR 项目引导到 Firebase App Hosting，由它统一托管整条链路（CDN、容器构建、渲染）。官方对比大致如下：
| 能力 | Firebase Hosting | Firebase App Hosting |
|---|---|---|
| 主要用途 | 静态站、SPA | SSR 框架（Next.js、Angular） |
| 服务端渲染 | 实验性（靠 Functions/Run） | 一等公民 |
| 请求超时 | 1 分钟 | 5 分钟 |
| 动态内容区域数 | 3 | 6 |
| 构建方式 | 本地（自己跑 build） | 可复现的云端构建 |
| GitHub 集成 | 有限 | 内置（push 自动部署） |
| 是否需要结算账户 | 否（免费档无需绑卡） | 是（Blaze） |
简单说：如果你的构建产物就是一个装着 HTML 和资源的目录，留在 Firebase Hosting；如果你确实需要每个请求都做服务端渲染，App Hosting 比老的 Functions-rewrite 写法更干净。本文聚焦经典的 Firebase Hosting，因为免费档和大多数独立静态站用的都是它。
怎么判断 Firebase Hosting 适合你
- 你已经在用 Firebase Auth、Firestore 或 Cloud Functions，想合并账单。
- 你的站点是纯静态 HTML、SPA，或 Astro/Vite 静态构建，而不是重度 SSR 应用。
- 你想要免费的 SSL 和全球 CDN，不想自己折腾证书。
- 你需要 preview channel 分享分支给客户看。
- 你不需要每个请求都做服务端渲染（需要的话用 App Hosting）。
免费额度的真实情况（Spark 档，2026 年 6 月）
Spark（免费）档对几乎所有独立静态站都够用，而且 不需要绑定结算账户：
| 资源 | Spark（免费） | Blaze（按量付费） |
|---|---|---|
| Hosting 存储 | 含 10 GB | 超出每 GB $0.026 |
| 流量 | 每月含 10 GB | 超出每 GB $0.15 |
| 自定义域名 + SSL | 包含 | 包含 |
| Preview channel | 包含 | 包含 |
如果在 Spark 上超出免费额度：存储超过 10 GB 时部署会被拦下，流量超额时站点会被停用，直到你升级到 Blaze。注意官方配额页现在把流量统一写成 每月 10 GB（旧的”每天 360 MB”说法已停用）。一个几百页的内容站，会稳稳待在免费档里。
开始前准备
- 有 Firebase 项目（Console 创建或
firebase projects:create）。 - 装好 Node 和
firebase-tools（npm install -g firebase-tools）。 - 静态 build 产物就绪（
dist/、out/、build/）。
实操步骤
-
确认输出是静态。 目录里有
index.html、资源目录、按路由的子目录。如果产物是 Node server（Next.js SSR 没静态导出），改用 Firebase App Hosting。 -
装 CLI、登录：
npm install -g firebase-tools
firebase login
firebase projects:list- 项目里初始化 hosting：
firebase init hosting
# ? Public directory? dist
# ? Configure as a single-page app? No (静态站 / Astro: No)
# ? Set up automatic builds and deploys with GitHub?（可选）- 静态内容站的基础
firebase.json：
{
"hosting": {
"public": "dist",
"ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
"cleanUrls": true,
"trailingSlash": true,
"headers": [
{
"source": "/_astro/**",
"headers": [
{ "key": "Cache-Control", "value": "public, max-age=31536000, immutable" }
]
},
{
"source": "**/*.html",
"headers": [
{ "key": "Cache-Control", "value": "no-cache, max-age=0" }
]
},
{
"source": "**/*.@(jpg|jpeg|png|webp|avif|svg|woff2)",
"headers": [
{ "key": "Cache-Control", "value": "public, max-age=2592000" }
]
}
]
}
}cleanUrls: true 会去掉 .html 后缀，并把带 .html 的请求做 301 重定向。trailingSlash: true 会把静态内容的 URL 重定向成带尾斜杠。带 hash 的资源走一年 immutable 缓存；HTML 走 no-cache，这样内容更新会立刻可见。
- rewrite 决策（只有需要动态路由才配）：
{
"hosting": {
"rewrites": [
{ "source": "/api/**", "function": "api" },
{ "source": "/render/**", "run": { "serviceId": "ssr-render", "region": "us-central1" } }
]
}
}rewrite 自上而下匹配，所以具体路径要放在任何兜底规则前面。SPA 需要 index.html 兜底时才用 ** → /index.html——内容站千万别用，会把真实 404 全压成 200。
- build + deploy：
npm run build
firebase deploy --only hosting
# Hosting URL: https://your-project.web.app- 无痕 + curl 验证：
curl -sI https://your-project.web.app/ | grep -i cache-control
curl -sI https://your-project.web.app/this-does-not-exist/ | head -1
# 期望 HTTP/2 404（不是 200）- 加自定义域名。 Firebase Console → Hosting → Add custom domain → 跟着向导走。它会给你一条
TXT所有权记录，加上指向 Firebase anycast IP 的A/AAAA记录（通常还有www的CNAME）。SSL 通过 Let’s Encrypt 自动签发；DNS 和证书签发最长可能要 24 小时。
执行检查清单
public与 framework 输出目录一致。- HTML 与 hashed 资源的缓存头分别显式配置。
- 内容站没有误用
**→/index.htmlrewrite。 - 自定义域名绿勾、SSL 有效。
- Deploy 释放有迹可循（Hosting → Release history）。
上线后验证
curl -sI显示预期缓存头。- 故意访问不存在路径返回 404，不是 200。
*.web.app和自定义域提供完全相同的内容。firebase hosting:channel:deploy能产出可分享的 preview URL。
容易踩的坑
- 明明需要 SSR 却去用 Firebase Hosting。2026 年起，SSR 项目交给 App Hosting，别再用老的 Functions-rewrite 绕路。
- 忘了配
cleanUrls或尾斜杠规则，部署完到处 404。 - 让 HTML 走长缓存，然后纳闷为什么内容没更新。HTML 保持
no-cache。 - public 目录配错了，经常配成源码目录而不是 build 产物。
- 不小心加了 SPA 兜底 rewrite，所有 URL 都返回首页。
FAQ
- Firebase Hosting 免费吗？: 免费，Spark 档不需要绑定结算账户。截至 2026 年 6 月，免费送 10 GB 存储和每月 10 GB 流量，对绝大多数独立站够用。
- Firebase Hosting 和 Firebase App Hosting 有什么区别？: Hosting 在 CDN 上托管静态文件和 SPA，免费档无需结算账户。App Hosting 是给 Next.js、Angular 这类 SSR 框架的新产品，在云端构建和渲染，支持 5 分钟请求超时和 6 个区域，需要 Blaze 档。
- Firebase Hosting 支持 SSR 吗？: 只能通过把请求 rewrite 到 Cloud Function 或 Cloud Run 间接支持，属于实验性，不是一等运行时。想要真正的 SSR，用 Firebase App Hosting 或 Vercel。
- 可以只用 Hosting 不用其它 Firebase 服务吗？: 可以。纯静态站完全没问题，不需要 Auth、Firestore 或 Functions。
- 会自动有 HTTPS 吗？: 会。默认
*.web.app域名和自定义域名都通过 Let’s Encrypt 免费签发 SSL，只要A/AAAA记录指向 Firebase 就会自动续期。 - 部署出问题怎么回滚？: Hosting 保留 release history。在 console 里点 Rollback，或运行
firebase hosting:clone把旧版本提升上来。