最近一直在找一个既便宜又稳定的 VPS,用来挂我手头一个域名(之前用的欧洲的一个免费主机,马上到期了)。偶然刷到零度的视频,才发现 Google Firebase 提供了一个号称永久免费的虚拟主机服务。虽然它只能托管静态文件、流量也有限,但对于我这种只是想挂个静态页面、偶尔折腾一下的人来说,简直是刚刚好!
Google Firebase 是谷歌提供的一套后端服务平台,其中的 Hosting(虚拟主机) 模块可以免费托管 HTML、CSS、JS 等静态内容。部署流程清晰简单,支持自定义域名、自动 HTTPS,而且全球 CDN 分发,访问速度也很不错。接下来我就记录一下从注册到部署的整个过程,以及我的实际使用体验。
1. Firebase Hosting 是什么?
Firebase Hosting 是 Google 提供的一项静态内容托管服务,属于 Firebase 这一整套后端平台的一部分。它主要用于托管 HTML、CSS、JavaScript、图片等静态资源,支持全球 CDN 加速、自动配置 HTTPS、自定义域名绑定等功能。
Firebase Hosting 最大的特点是“部署简单、免费易用、全球加速”,非常适合部署那些不需要后端逻辑的网页项目,实际测试下来速度还算不错,不过需要 FQ,这是和 Cloudflare page 最大的差距。用 Firebase Hosting 可以做:
- 前后端分离的前端项目(可搭配其他后端服务使用)
- 个人简历页面(Portfolio)
- 博客或文档类网站(例如 Hexo、Hugo 等生成的静态博客)
- 项目展示页或产品 Landing Page
Firebase Hosting 的免费额度对于部署一个普通的静态网站来说绰绰有余。尤其是部署个人介绍页、博客、项目展示等用途,即使你的网站每天有几百个访客,也基本不会超限,关键是“永久免费”😉。
项目 | 免费额度上限 |
---|---|
出站流量 | 每月 10 GB |
存储空间 | 每月 1 GB |
读取请求次数 | 每日最多 20,000 次 |
自定义域名 | 支持,免费配置 HTTPS 证书 |
CDN 加速 | 支持全球 CDN |
2. Firebase Hosting 部署过程实录
整个部署过程大致可以分为三个步骤:准备工具 → 注册项目 → 本地构建并部署。Firebase Hosting 本质上是一个静态虚拟主机平台,不支持在线上传或操作代码,因此我们必须在本地构建项目后,通过命令行上传部署。这种方式虽然对初学者稍有门槛,但流程清晰、可控性强,一旦掌握之后非常高效。
2.1 所需工具
部署过程中至少需要以下几种工具,尤其是 VPN。后续步骤中会对每项工具的使用方法进行详细说明。
- Google 账号:用于登录 Firebase 平台
- Node.js 环境:支持构建工具和 Firebase CLI 运行
- Firebase CLI:用于本地部署、初始化、绑定项目等命令操作
- VPN:国内访问 Firebase 及 Google 服务可能受限,需支持 TUN 模式
- 其他常用软件:SSH、编辑工具等,用于优化操作体验。
2.2 Firebase Hosting 注册
打开 Firebase 控制台首页,使用 Google 账号进行免费注册。他家的简体中文界面做得相当不错,整个流程基本可以“无脑”点击下一步完成,这也是我非常不喜欢 Cloudflare 的一个原因 —— 它那蹩脚的中文界面,还不如干脆用英文。

首先,Firebase 会提示你输入一个项目名称,用于识别和管理你的站点;接着,会询问你是否开启 Google AI 功能、是否启用 Google Analytics 分析,均可根据需要选择开启或关闭;完成以上步骤后,系统会创建一个新的 Firebase 项目,并进入该项目的概览页面。
页面往下滑,找到“Hosting” → 点击“开始使用”按钮,正式进入 Firebase Hosting 的部署流程。此时会弹出 Hosting 的使用步骤引导,主要包括:安装 Firebase CLI、本地初始化项目、上传部署等。

如上图所示(如果配图的话),Firebase Hosting 是一种典型的虚拟主机服务。它与 VPS 或云服务器的最大区别在于:你无法远程登录服务器,也无法安装面板或执行命令行操作。所有的网站内容都必须在本地准备好后,通过工具构建并上传。因此在接下来的操作中,我们会用到像 Node.js 这样的本地开发环境工具。
2.3 安装 Firebase CLI 并初始化项目
✅ 第一步:安装 Node.js(含 npm)
以 Windows 系统为例,第一步我们需要安装 Node.js(官网地址)。Node.js 是一个运行 JavaScript 的后端环境,Firebase CLI 依赖它来运行相关命令。它是完全免费开源的,直接下载最新版,默认安装即可,无需额外配置。
安装完成后,打开 Windows 自带的命令提示符(CMD),输入以下两条命令检查是否安装成功:
node -v
npm -v
如果两条命令都能正常输出版本号(2025/06/06,v22.16.0 & 10.9.2),就说明 Node.js 和它自带的包管理器 npm 都已安装成功。其中 npm
(Node Package Manager)是 Node.js 的包管理工具,后续我们安装 Firebase CLI 就会用到它。简单来说,它就像一个“应用商店”,负责下载和管理各种 JavaScript 工具和库。
✅ 第二步:安装 Firebase CLI 工具
接下来我们需要安装 Firebase CLI,它是 Firebase 提供的命令行工具,用于项目初始化、部署、配置等操作。主要命令即谷歌页面上提示的命令,安装完成后我们还可以检查下版本,看是否成功。本过程建议在管理员权限下运行命令提示符,并确保系统处于全局代理状态(因为 npm 需要联网下载依赖,国内访问可能会失败)。
npm install -g firebase-tools
firebase --version

如果正常显示版本号,就说明 Firebase CLI 已成功安装并生效了。后续所有 Firebase 操作几乎都要用到它。
✅ 第三步:安装 WSL(Windows Subsystem for Linux)
WSL 是 Windows 提供的“适配 Linux 环境”的子系统,可以在 Windows 内部运行 Linux 命令和工具,对于前端开发、部署等操作非常方便。首先,以管理员身份打开 PowerShell(在开始菜单中搜索“PowerShell”,右键选择“以管理员身份运行”)。注意,这里说的 PowerShell 是 Windows 的命令行工具之一,缩写是 ps
或 pwsh
,它比传统的 CMD 功能更强大。
执行以下命令安装 WSL:
wsl --install
在此之前,请确认以下几点:
- 电脑 BIOS 中的虚拟化功能已开启(大多数新电脑默认是开启的)
- 系统中未安装其他虚拟机软件(如 VMware、VirtualBox 等),否则可能与 WSL 冲突
- 保持全局代理开启状态
这个安装过程可能会持续一段时间,因为系统需要从微软服务器下载完整的 Linux 镜像(默认是 Ubuntu)并进行本地部署。如果网络不稳定,或者其他上述情况,下载过程中可能会卡顿甚至失败,建议保持耐心等待。当然,你也可以考虑通过离线方式安装,规避网络问题。Kevin 在台式机上下载慢且装不上,在笔记本上反而很快就装好了。

安装完成后,系统会提示你重启电脑。重启后,首次启动 WSL 时会引导你设置一个 Linux 用户名和密码。完成这一步之后,就可以在 Windows 中直接使用 Linux 命令行环境了。
✅ 第四步:对接 WSL 和 Node.js
这里解释一下为何要装 WSL,Google 官方是没有这一步骤的。Firebase 官方文档通常假设用户在原生 Linux、macOS 或 Windows 环境中操作,但 WSL(Windows Subsystem for Linux)为 Windows 用户提供了一个轻量级的 Linux 环境,允许运行 Linux 命令和工具(如 Firebase CLI),同时与 Windows 文件系统无缝交互。这对于需要 Linux 环境的高级用户(如运维 WordPress 网站或处理复杂脚本)尤其有用。在 WSL 中运行 Firebase CLI,可以避免 Windows 命令行的一些兼容性问题,同时保持 Linux 的权限管理和文件操作灵活性。
在本步骤中,需要使用全局 TUN 代理(虚拟网卡模式,更高级别的真全局代理模式),不然 WSL 会报错!这是因为 WSL 的网络环境可能受限于 Windows 的网络配置,尤其是在中国大陆访问 Firebase 等服务时,网络连接可能不稳定。全局 TUN 代理通过虚拟网卡重定向流量,确保 WSL 能正常访问 Firebase 服务器。我们先使用 sudo -i
切换为 root 超级用户,然后执行以下命令:
curl -fsSL https://deb.nodesource.com/setup_lts.x | bash -
apt install -y nodejs
npm install -g firebase-tools


💡 特别提醒:本步骤完成后,请切换回普通用户!后续操作继续使用 root 可能引发权限问题。时间过程中,博主因未切换用户,导致项目上线后重复初始化两次,浪费时间。切换回普通用户(如 kevin)的命令为:exit
。
✅ 第五步:本地对接 Firebase Hosting 并初始化
简言之就是把本地搭建的环境与云端的 Firebase Hosting 连接起来,运行下面命令来获取授权地址:
firebase login --no-localhost

如图所示,若网络连接正常,系统会提示是否启用 Gemini 人工智能和是否允许收集错误信息。我选择全部拒绝(输入n
回车选“否”)。随后,命令行会显示一个链接,复制该链接到浏览器并打开,使用我们之前创建项目的 Google 账号登录和授权,授权过程中直接允许所有权限即可。
接下来,完成三个步骤确认信息,最终会获得一串验证码。将验证码复制并粘贴回命令行。此时,环境配置已就绪。同时,浏览器地址栏会变为 localhost:xxxx/xxxx
,浏览器页面显示“Firebase CLI Login Successful”。
至此,我们已通过 Firebase CLI 成功对接远程虚拟主机。接下来,在命令行输入以下命令初始化 Hosting 项目:
firebase init hosting


上左图是执行初始化命令后成功创建应用的提示界面,可见它提示 Firebase project in this directroy: /root,这个目录权限很高,导致我无法直接在 Windows 资源管理器里边修改文件,因此务必要切换为普通用户。
回车,Firebase CLI 会询问几个配置问题,包括是否创建公共目录、是否为单页应用(SPA,涉及 Rewrite 规则)、是否对接 GitHub 等。我的设置供参考:选择默认 public 目录,启用单页应用 Rewrite 规则(所有 URL 重定向到 index.html),并跳过 GitHub 自动部署。初始化完成后,Firebase 会在项目目录生成 firebase.json 和 public 目录,内含一个默认的 index.html 文件,可作为测试用。接下来,使用以下命令部署项目,创建对外访问的连接:
firebase deploy --only hosting
部署完成后,Firebase 会自动生成应用链接和项目控制地址。我分配到的是 https://logoideas-7994c.web.app/。测试后发现,访问速度极快,不愧是大厂!更惊喜的是,无需翻墙即可使用!🐂🍺 +
2.4 绑定自有域名
Firebase Hosting 项目现已部署完成,可通过分配的 URL 在线访问。上文 2.3 提到的环境配置是整个过程中最复杂的环节,主要因本地虚拟机安装的不确定性。部分 Windows 系统可能因硬件限制(如主板不支持虚拟化)或缺失组件导致 WSL 安装失败。
即便环境配置成功,还需解决网络问题。好在实际操作仅需几条简单命令即可完成。不管过程多曲折,成功部署后,山高路远,轻舟已过万重山……绑定域名就简单多了。
- 访问 Firebase 控制台
打开 Firebase 控制台,点击左侧“Hosting”菜单,查看项目详细信息。可见 Google 默认分配两个二级域名(如 *.web.app 和 *.firebaseapp.com)。若需使用自有域名,点击“添加自定义网域”开始绑定。 - 配置域名解析
在弹出的域名验证提示框中,Firebase 会要求:- 将域名的 A 记录解析到 Google 提供的 IP 地址。
- 添加一条 TXT 记录以验证域名所有权。
- 删除可能冲突的旧解析记录(如之前的 A 或 CNAME 记录),以避免问题。
配置完成后,等待 DNS 解析生效(通常几分钟至数小时,视 DNS 服务商而定)。
- 验证和 SSL 证书
解析生效后,Firebase 会自动验证域名所有权。验证通过后,系统将为你的域名自动生成并配置 SSL 证书,确保网站通过 HTTPS 安全访问。整个过程无需手动干预,证书生成通常在几分钟内完成。 - 验证绑定效果
绑定成功后,访问你的自定义域名,应能看到与 *.web.app 相同的网站内容。若未生效,可检查:- DNS 解析是否正确:使用 dig 或 nslookup 检查 A 和 TXT 记录。
- 浏览器缓存:使用隐身模式或清除缓存后重试。
- Firebase 控制台状态:确保“Hosting”页面显示域名状态为“已连接”。
通过以上步骤,你的自定义域名即可成功绑定到 Firebase Hosting,访问体验更专业,且全程享受 Google 提供的快速 CDN 和免费 SSL 证书服务。
3. 上传第一个静态网页
部署静态网页是 Firebase Hosting 的核心使命之一。我注意到一些教程提到使用 Firebase Storage(类似 FTP)快速上传修改后的静态文件(如 HTML)。但截至 2025 年 6 月 6 日,测试发现 Storage 功能需绑定信用卡并按使用量计费(超出免费额度后)。考虑到成本,我选择放弃此方法。
我们老老实实使用 Firebase CLI 上传文件。在第 2 节初始化 Hosting 时,已配置为单页应用(Single Page App)。接下来,我找了一份优质的 HTML 源码进行测试,验证部署效果。
为便于我自己记忆和照顾新手,这里重申一下操作逻辑(参考第 2 节):WSL 提供 Linux 环境,Node.js 支持运行 Firebase CLI,让你在本地编辑和测试网站文件(如 index.html)。本地测试通过 firebase serve
完成,确认无误后,使用 firebase deploy --only hosting
命令将 public
目录的文件手动上传至 Firebase Hosting 远程服务器,实现上线。本地和远程文件不会自动同步,每次修改需手动部署。
WSL 的最大优势在于无缝整合 Windows 和 Linux 文件系统。如下图所示,你可以直接在 Windows 资源管理器中访问并编辑 WSL 的文件,无需通过 SSH 或复杂的命令行操作。这极大简化了文件管理流程。

在 Windows 中准备好 HTML、JS、CSS 等静态文件,放入指定目录后,只需在 WSL 终端统一文件权限,然后部署到 Firebase Hosting,整个过程流畅高效。
- 通过 Windows 管理文件
在 Windows 资源管理器中,打开\\wsl.localhost\Ubuntu\home\kevin\public
,直接编辑或拖入 index.html、图片、CSS 等文件。例如,将 Windows 桌面上的 D:\Desktop\public 文件复制到此路径,操作如同管理普通 Windows 文件夹。 - 同步权限
由于 Windows 和 WSL 的权限模型不同,复制后的文件可能权限不正确。在 WSL 终端运行以下命令,确保 Firebase CLI 能正常访问:chmod -R 755 /home/kevin/public/
- 部署到 Firebase Hosting
文件准备就绪后,进入 WSL 项目目录并部署:firebase deploy --only hosting
。

- 命令行同步(可选)
对于熟悉命令行的用户,可通过 WSL 终端同步 Windows 文件。例如,将 D:\Desktop\public 的内容复制到 /home/kevin/public/,命令行应为:cp -r /mnt/d/Desktop/public/* /home/kevin/public/
这种方式适合高级用户,但对新手较为繁琐。此外,使用 nano 编辑文件对不熟悉命令行的用户可能有难度。因此,推荐直接在 Windows 资源管理器完成文件编辑,再用 chmod 统一权限,简单高效。

4. Firebase Hosting 使用体验
Firebase Hosting 的体验令人印象深刻!它免费,提供全中文界面,依托 Google 全球 CDN,性能毋庸置疑,访问速度极快。最最最关键的是,它无需翻墙即可流畅使用,体验极佳!
Firebase CLI 的易用性超出预期,我在笔记本上配置 Firebase Hosting 非常顺畅,当前版本 WSL 运行时内存占用仅约 900MB,完全在可接受范围内。相比传统 VPS,Firebase Hosting 免去服务器维护麻烦,部署单页应用简单高效。虽然免费版需通过 CLI 命令(如 firebase deploy --only hosting)上传文件,略显繁琐,但免费的代价完全值得。
下一步,我计划基于 Firebase Hosting 搭建一个静态博客,具体步骤将在后续文章分享。总的来说,Firebase Hosting 简单、稳定、免费,我强烈推荐并计划长期使用!
略微复杂,如果只是托管静态页面的话,还是Cloudflare pages比较香。