写完代码只是上半场：一个人把网站送上公网的清单

你让 AI 帮你写完了第一个能跑的项目，在 localhost:3000 上看起来漂漂亮亮，功能也都通了。然后你冒出一个念头：能不能发个链接，让朋友也打开看看？

这一步就叫"上线"。别小看它：本地跑得好好的项目，放到公网上会遇到一堆本地根本不存在的问题——域名去哪买、DNS 怎么配、为什么浏览器说"不安全"、为什么线上读不到环境变量、数据库放哪。每一个坑，都有无数人在你之前踩过。

这篇就是一份"照着做就能走完"的清单。我会告诉你每一步做什么、用什么命令、以及为什么有这一步——因为只知道"怎么做"的人，下次换个平台还是会翻车；知道"为什么"的人，走到哪都能自己排错。

先想清楚：你的项目到底需要哪种"上线"

别一上来就买服务器。先回答三个问题：这个项目需要后端吗？需要数据库吗？需要 WebSocket、定时任务这类长连接吗？

三个都是"不"——比如博客、作品集、落地页、文档站：走静态托管。git push 就上线，免费档对个人项目完全够用。有一个"是"：往全栈托管看。几个主流选择，一句话定位：

• Vercel：前端和 Next.js 的亲儿子，Serverless 函数开箱即用，vercel --prod 一行命令就发布。Hobby 档免费，但带宽每月 100GB，超了收费——图片视频多的站要注意。
• Netlify：静态站老字号，表单收集、Serverless 函数都有，免费档够小站用，界面对新手友好。
• Cloudflare Pages：免费档最大方，构建速度快，配上 Workers 能干不少后端的活，全球 CDN 天生自带。
• Render：想跑 Node/Python 后端加数据库、又不想碰 Docker 的人。免费 Web Service 15 分钟没流量会休眠，第一个访客要等它"睡醒"。
• Fly.io：给你一台真正的虚拟机，Docker 镜像随便跑，Postgres 也能自己装。按量计费，个人小项目通常每月几美元，自由度最高，动手门槛也最高。

新手公式：纯前端 → Vercel 或 Cloudflare Pages；Next.js 全栈（含 API 路由、登录）→ Vercel；要跑 Python 后端、爬虫、定时任务 → Render 或 Fly.io。选错平台后期迁移很疼，花十分钟想清楚，比上线后重来划算得多。

买域名：名字想三分钟，续费想三年

域名是你项目在公网上的门牌号，买之前想三件事。

命名。短、好念、好拼，念给朋友听一遍他能拼对，就是好名字。避开商标坑：别在名字里夹大公司的品牌词，律师函比 404 可怕得多。动手前搜一下有没有同名产品，省得上线当天发现重名。

注册商。Cloudflare Registrar 按成本价卖域名、续费不加价，是长期持有最省心的；Namecheap、Porkbun 也是口碑不错的选择。国内用户可以用阿里云、腾讯云——但如果你的服务器在海外，记得备案那套规则只管国内机房。

后缀的 reality check。.com 首年十几美元、续费也十几美元，最保值，优先选它；.dev 十几美元，但整个后缀被 HSTS 预加载了——意味着浏览器强制只用 HTTPS 访问，你上线第一天就得把证书配好，没得商量；.ai 首年加续费一年七八十美元，年年都贵，项目还没收入之前三思。凡是"首年 1 美元"的促销，下单前一定去看 renewal price（续费价）——那才是你每年真正要交的钱。

把 DNS 交给 Cloudflare

买完域名，下一步是告诉全世界"这个域名指向哪台服务器"，这就是 DNS。建议把域名的 nameserver 换成 Cloudflare（免费套餐就够），理由很实在：免费、DNS 生效快、送 CDN、还附带一键 HTTPS 证书能力。一个后台管完，后面几步都省心。

记录怎么写，记住两条：

• 裸域（apex，也就是不带 www 的 example.com）：写 A 记录，指向平台给你的 IP。Vercel 是 76.76.21.21，Netlify 是 75.2.60.5，照着平台文档填就行。
• www 和其他子域名：写 CNAME 记录，指向平台给你的域名，比如 cname.vercel-dns.com。

裸域有个经典坑：按 DNS 标准，apex 位置不允许写 CNAME，很多注册商自带的 DNS 就不支持。但 Cloudflare 做了 CNAME 扁平化，在它家 apex 写 CNAME 也能用。所以如果你按某篇教程在别家 DNS 给裸域配了 CNAME 却一直不生效，别怀疑人生，换个写法就行。

Cloudflare 里还有朵"云"要注意：记录旁边的橙色云朵表示代理（流量先过 Cloudflare，才有 CDN 和它的证书），灰色表示仅 DNS（直连你的服务器）。刚绑定域名排错时，可以先切灰色直连源站，确认服务本身没问题，再打开橙色。

验证解析用 dig：dig +short example.com 看返回的 IP 对不对；着急的话指定 Cloudflare 的 DNS 查：dig @1.1.1.1 example.com +short。记住这条命令，下一节还会用到。

环境变量：翻车重灾区

如果只能记住一句话，记住这句：.env 永不进 git。 API 密钥、数据库密码一旦提交到公开仓库，就等于贴在了大街上——爬虫几分钟内就能扫到。

先做卫生检查：.gitignore 里加上 .env*，已经误提交过的用 git rm --cached .env 踢出版本跟踪（注意这只是不再跟踪，历史记录里的密钥还得作废重换）。随时自查：git ls-files | grep -i env，有输出就说明还有漏网之鱼。

线上的变量去平台后台配：Vercel 在项目 Settings → Environment Variables，Render 在 Dashboard 的 Environment 标签页。配完要点 Redeploy 才会生效。本地开发想跟线上对齐，别手抄，用 vercel env pull .env.local 一键拉下来。

重灾区预警：构建时变量 vs 运行时变量。Next.js 里以 NEXT_PUBLIC_ 开头的变量，会在构建时就被写死进前端 JS 包。真实翻车：有人把 NEXT_PUBLIC_API_URL 配成了测试地址，构建上线后才发现，改成正式地址，保存——前端还是旧的。为什么？因为值已经打包进 JS 文件了，改后台配置不会重写历史构建。修法只有一条：改完这类变量，必须重新构建部署。而服务端的 DATABASE_URL 这类变量是运行时读取的，改完重部署（甚至重启）就行。分不清的时候就问自己：这个值会出现在浏览器下载的 JS 里吗？会，就是构建时变量。

HTTPS：证书不用你操心，但你要会验

原理一句话：Vercel、Netlify、Cloudflare 这些托管平台会在你绑定自定义域名后，用 ACME 协议自动向 Let's Encrypt 申请证书、到期自动续期。你要做的只是在平台点"添加自定义域名"，按提示配好 DNS，剩下的它自己搞定。

但"自动"不等于"不用验"。上线后做三件事：浏览器地址栏看小锁点开，确认证书颁发给了你的域名；跑 curl -vI https://example.com 看 TLS 握手是否正常；查有效期：echo | openssl s_client -connect example.com:443 -servername example.com 2>/dev/null | openssl x509 -noout -dates。

Cloudflare 用户记得打开 Always Use HTTPS，让 http 自动跳 https，避免搜索引擎收录两个版本。另外 HSTS（告诉浏览器"以后只用 HTTPS 来找我"）别在第一天就开，更别开 HSTS Preload：一旦开了 includeSubDomains，你某个子域名证书没配好就会全挂，而且浏览器里的 HSTS 缓存极难清除。等全站 HTTPS 稳定跑几周，再考虑这件事。

数据库和文件存储：别塞进 git

项目需要数据库，三个省心选择：Supabase（Postgres 加认证加存储全家桶，免费档大方，适合一个人全都要）；Neon（Serverless Postgres，按量计费，免费档有额度上限，适合用量小的项目）；PlanetScale（MySQL 系，免费政策历史上变过几次，下手前务必看一眼官网 pricing 页，别按旧教程的印象做决定）。连接串一律放环境变量，别写进代码。

用户上传的图片、视频走对象存储：Cloudflare R2（S3 兼容，最大的卖点是流出流量不收费）或 AWS S3。千万别把上传文件塞进 git 仓库——GitHub 单个文件超过 100MB 直接拒绝 push，仓库膨胀之后每次 clone 都是一场折磨，图片就该待在对象存储里。

还有一件事上线第一天就做：确认数据库的自动备份开着。Supabase 和 Neon 的免费档都有每日备份或时间点恢复额度，别等到删库那天才想起来看。

上线之后：报错和"还活着吗"

网站上线后，你最怕两件事：出 bug 了没人告诉你；挂了没人告诉你。两件事都有标准解法。

报错监控用 Sentry。Next.js 项目跑 npx @sentry/wizard@latest -i nextjs，一路回车就能接好。之后生产环境的报错会带着堆栈直接推到你面前，而不是等用户截图发你"好像坏了"。

存活监控用 Better Uptime（免费档够用），或者自己搭 Uptime Kuma。每几分钟 ping 一次首页，挂了就发邮件或 Telegram 通知你。别觉得小项目没人访问就不用——你自己就是第一个需要知道它挂了的人。

日志去平台后台看。Vercel 是 Deployments → 点某次部署 → Runtime Logs；命令行党用 vercel logs <deployment-url>。出问题先看日志，别靠猜——猜错的概率远大于你想象。

回滚预案：给自己留条后路

上线前先接受一个事实：你一定会发布一个有 bug 的版本。区别只在于，炸的时候你能不能在 60 秒内恢复。

好消息是，每次部署都对应一次 git 提交，Vercel、Netlify 的 Deployments 列表就是你的时间机器：找到上一次正常的部署，点 Promote to Production（或 Rollback），流量几十秒就切回去。下面是一张真实的 Vercel Deployments 页面截图——注意每次部署的提交信息和 Current 标记，养成写清楚提交信息的习惯， rollback 的时候你会感谢自己。

git 层面：线上修小 bug 用 git revert <commit>，它会生成一笔反向提交，历史干净可追溯。别在 main 分支上 git reset --hard 再强推——你一个人也可能坑到自己，比如另一台电脑上的工作区还在旧提交上。

数据库迁移要养成"可逆"的习惯：每个迁移都写 down 逻辑；改表结构用"先加后删"（expand-contract）：先加新字段、双写数据、切读流量，确认无误后再删旧字段。别在一次迁移里又改结构又导数据，回滚的时候你会发现根本回不去。

上线前检查清单：照着打勾

发布前花十分钟，把下面每一条亲手验证一遍：

• ☐ dig +short example.com 返回的 IP 对吗？www 的呢？
• ☐ https:// 能打开吗？证书是你的域名吗？http:// 会自动跳到 https 吗？
• ☐ 平台后台的环境变量配全了吗？NEXT_PUBLIC_ 开头的改完重构建了吗？
• ☐ 在生产环境亲手走一遍核心流程（注册、下单、发帖），别只看首页。
• ☐ 404 页面有吗？500 错误会吞掉堆栈吗（别把源码报错直接吐给用户）？
• ☐ 拿手机打开看一眼，按钮点得到、字看得清吗？
• ☐ .env 没进 git 吧？git ls-files | grep -i env 再查一遍。
• ☐ Sentry 能收到一条测试报错吗？存活监控配好了吗？
• ☐ 数据库自动备份开着吗？

四个最常见的翻车现场

1. DNS 没生效就急着点验证。改完 nameserver 或解析记录，先跑 dig @1.1.1.1 example.com +short 确认全网能查到，再去平台点"验证域名"。验证失败多半不是平台坏了，是 DNS 还没传播过来，喝杯水等几分钟。

2. 代码里写死 localhost。fetch("http://localhost:3000/api/...") 在你电脑上没问题，上线就全灭。API 地址走环境变量；前后端同域部署最省心，连跨域问题都省了。

3. 把 API key 提交到公开仓库。先去服务商后台把 key 作废重换——这一步不能省，删仓库、改历史都救不回一个已经泄露的 key。然后再清 git 历史（git filter-repo 或 BFG）。顺序别反。

4. 免费档休眠，首次访问转半天。Render 的免费 Web Service 15 分钟没流量就睡，第一个访客要等几十秒冷启动。个人小项目完全可以接受；接受不了就升级付费档。别指望靠定时 ping 永远把它唤醒——那是跟平台斗智斗勇，赢不了。

写完代码只是上半场。下半场没有 AI 替你踢，域名、DNS、证书、环境变量，每一步都得亲手走一遍。但走完这一遍，你就拥有了一个真正的、别人能打开的网站——那种成就感，localhost 给不了。