1. 先搞清楚Vibe Coding 网站部署到底在做什么Vibe Coding 网站部署说白了就是把你用 AI 在本地敲出来的那个能跑起来的项目搬到一台公网能访问的机器上再给它配一个别人记得住的名字。这件事过去确实只有程序员干因为要碰服务器、域名解析、SSL 证书这些词。但现在你完全可以让 Agent 帮你干你只需要理解大致逻辑剩下的交给它。我先用开店打个比方。你在本地localhost:3000打开的那个页面相当于你在自己家客厅摆了个摊位只有你自己能看见。部署就是把这个摊位搬到一条真正的商业街上这条街就是服务器。服务器是一台常年开机、接入公网的电脑你的代码放上去、程序跑起来别人才能通过网址找到你。服务器有一个 IP 地址是一串数字。你当然可以把这串数字发给朋友让他访问但没人记得住。于是就有了域名比如yourblog.com。买下域名只相当于给店起了个名字还没告诉互联网这家店开在哪。域名解析就是去地图上登记这个域名对应这台服务器。别人输入域名互联网先查一下找到对应服务器再把页面送过去。最后是 HTTPS。你现在访问的网站大多以https://开头它解决两件事一是用 SSL 证书验证网站身份降低访问到假站的风险二是对浏览器和服务器之间传输的内容加密用户填的密码、表单即使被截获也看不懂。证书可以理解成网站的电子身份证。所以整条链路就是代码放服务器 → 域名指向服务器 → 配好 HTTPS。这三件事现在都可以让 Codex 这类 Agent 通过 CLI 帮你完成你主要负责扫码登录和授权。我实测下来真正需要你手动操作的环节比想象中少很多。这一篇我会把三种落地路径都讲清楚自己买服务器、域名解析、以及用 CloudBase 托管。你可以根据自己的情况选一条走也可以先看完再决定。下面先从最省事的 CloudBase 路线开始因为它对小白最友好免费额度也够跑起来。2. 部署前的准备TaoToken 接入与 CloudBase 环境开通在正式部署之前有一个前置动作很多人会忽略你的 Vibe Coding 项目里如果调用了大模型接口那接口的 Base URL 和 Key 得先配好否则部署上去页面能打开、接口却报错。这里我用 TaoToken 来做模型接入它的 API 地址是https://taotoken.net/api兼容 OpenAI 风格的调用方式配置起来很直接。你需要在 TaoToken 控制台创建一个 API Key然后把它写进项目的环境变量里。注意Key 不要硬编码在代码里也不要提交到 Git 仓库用.env文件管理部署时在平台侧配置环境变量。这是很多人第一次部署会踩的坑本地跑得好好的上线后接口 401就是因为环境变量没同步过去。TaoToken 的接入文档在https://taotoken.net/doc里面有各语言的调用示例。如果你只是想先验证模型能不能通可以打开模型对话页面https://taotoken.net/model-chat直接试一句确认 Key 有效再往下走。长期做编码和 Agent 任务的话可以了解下 Coding Planhttps://taotoken.net/coding-plan额度模型更适合持续开发场景。接下来开通 CloudBase。进入腾讯云控制台找到云开发 CloudBase创建一个云开发环境。数据库选默认的云数据库就行。现在每个账户有免费资源额度个人博客或小产品刚上线大概率够用先不用付费。创建好环境后在 Codex 里安装 CloudBase CLI。这一步不用自己动手把官方文档https://docs.cloudbase.net/发给 Codex让它按文档安装 CLI 即可。CLI 装好后需要完成一次授权把本机 CLI 和刚开通的 CloudBase 环境连起来。你可以把授权理解成允许本地 Codex 操作你的腾讯云账号。授权完成后Codex 就能通过 CLI 把项目上传到 CloudBase 并完成部署。从这里开始大部分操作可以交给 Agent。如果你走的是自建服务器路线那前置准备是另一套买一台云服务器、装好 Node 或 Nginx 运行环境、配好安全组放行端口。这部分我放在第 3 节一起讲因为配置模板是通用的。3. 可复制配置环境变量、构建配置与部署模板这一节给你可以直接抄的配置。不管你走服务器还是 CloudBase环境变量和构建配置这两块是共通的先把它们准备好后面部署会顺很多。先看环境变量模板。在项目根目录建一个.env.example把需要配置的项列出来真正的.env不提交# .env.example # 模型接口配置TaoToken OPENAI_BASE_URLhttps://taotoken.net/api OPENAI_API_KEYsk-your-taotoken-key # 应用自身配置 NEXT_PUBLIC_SITE_URLhttps://yourdomain.com DATABASE_URLyour-database-connection-string部署到 CloudBase 或服务器时在平台的环境变量面板里逐项填入真实值。注意NEXT_PUBLIC_前缀的变量会被打包进前端不要往里放密钥。再看构建配置。以 Next.js 项目为例next.config.js里要确认输出模式CloudBase 托管静态资源时通常用默认构建即可// next.config.js /** type {import(next).NextConfig} */ const nextConfig { reactStrictMode: true, output: standalone, // 自建服务器部署时用 standaloneCloudBase 静态托管可去掉 env: { SITE_URL: process.env.NEXT_PUBLIC_SITE_URL, }, }; module.exports nextConfig;如果你走自建服务器Nginx 反代配置可以这样写把 3000 端口的 Node 服务暴露到 80# /etc/nginx/conf.d/blog.conf server { listen 80; server_name yourdomain.com www.yourdomain.com; location / { proxy_pass http://127.0.0.1:3000; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection upgrade; proxy_set_header Host $host; proxy_cache_bypass $http_upgrade; } }CloudBase 侧的部署配置用 CLI 时可以在项目里放一个cloudbaserc.json声明环境和部署目标{ envId: your-cloudbase-env-id, framework: { name: blog, plugins: { web: { use: cloudbase/framework-plugin-website, inputs: { buildCommand: npm run build, outputPath: dist, cloudPath: / } } } } }这里三个关键件必须齐全Base URL 填https://taotoken.net/apiKey 填你在 TaoToken 控制台创建的 KeyModel ID 填你实际调用的模型名比如gpt-4o或claude-3-5-sonnet。这三样缺一个接口就会报错。如果你用 Claude Code 做润色或代码生成接入时同样要配全这三件套Base URL 指向 TaoToken 的 API 地址不要留空。配置写好后本地先跑一次npm run build确认能构建成功再往下走。构建失败的话部署一定失败先解决构建问题。4. 验证部署页面可访问、接口连通、自定义域名生效部署命令跑完不代表就成功了必须逐项验证。我按顺序给你三个检查点每个都有明确的成功标志。第一个检查点页面可访问。CloudBase 部署完成后CLI 会返回一个默认域名形如https://your-env-xxx.tcloudbaseapp.com。在浏览器打开它如果能看到你的首页说明静态资源上传成功。如果打开是 404检查cloudPath是否配成了/以及构建产物目录是否和outputPath一致。自建服务器的话直接访问服务器 IP看 Nginx 是否返回页面。第二个检查点接口连通。打开浏览器开发者工具切到 Network 面板触发一次调用模型接口的操作看请求是否返回 200。如果返回 401多半是OPENAI_API_KEY没配或配错如果返回 404检查OPENAI_BASE_URL是否写成了https://taotoken.net/api注意结尾不要多加/v1之外的路径。你也可以在服务器上直接用 curl 验证curl -X POST https://taotoken.net/api/chat/completions \ -H Authorization: Bearer $OPENAI_API_KEY \ -H Content-Type: application/json \ -d { model: gpt-4o, messages: [{role: user, content: ping}] }返回里有choices字段就说明接口通了。如果报reading choices之类的错通常是响应结构和你代码里解析的字段对不上检查一下返回体。第三个检查点自定义域名生效。在 CloudBase 控制台或域名服务商处添加解析记录把你的域名 CNAME 指向 CloudBase 提供的默认域名。解析生效一般几分钟到几小时可以用dig或在线工具查dig yourdomain.com CNAME short返回的 CNAME 值和你配置的一致就说明解析生效了。然后在浏览器访问https://yourdomain.com确认能打开且地址栏有小锁图标说明 HTTPS 证书也配好了。CloudBase 支持自动申请免费证书自建服务器可以用 Lets Encrypt 的 certbot 签发。三个检查点全过你的 Vibe Coding 产品就算真正上线了。任何一步卡住把报错截图和当前页面丢给 Codex让它继续排查比你自己查资料快得多。5. 常见报错排查401、local proxy failed、OAuth 与解析失败部署过程中有几类报错特别高频我把自己踩过的和读者反馈多的整理出来对照着查能省不少时间。第一类接口 401 Unauthorized。这是最常见的。原因通常是环境变量没生效。检查顺序平台侧环境变量面板里OPENAI_API_KEY是否填了真实 KeyKey 是否有多余空格或换行本地.env和线上环境变量是否一致。如果 Key 本身没问题去 TaoToken 控制台的 API Keys 页面https://taotoken.net/api-keys确认这个 Key 还在有效期内、额度没用完。还有一种情况是代码里读环境变量的时机不对比如在客户端组件里读了服务端才有的变量这种要改成通过接口转发。第二类local proxy failed或连接超时。这个报错一般出现在本地 CLI 和云端通信时。先确认本机网络能正常访问外网再检查 CloudBase CLI 是否完成了授权。如果授权过期重新跑一次登录命令。自建服务器场景下这个错多半是安全组没放行端口去云服务器控制台把 80、443 和你的应用端口加进入站规则。第三类OAuth 授权失败或回调地址不匹配。用 CLI 授权时浏览器会跳转到一个回调页。如果回调失败检查你复制的授权链接是否完整以及本机是否开了会拦截回调的软件。重新生成一次授权链接通常能解决。如果项目里集成了第三方登录回调地址要和你配置的域名一致http://localhost和https://yourdomain.com不能混用。第四类域名解析不生效或 HTTPS 报证书错误。先用dig确认 CNAME 是否生效没生效就等DNS 有缓存。证书错误的话检查证书是否绑定了正确的域名以及是否过期。CloudBase 自动证书偶尔会有签发延迟手动刷新一下。自建服务器用 certbot 续期时记得配一个定时任务否则三个月后证书过期网站会打不开。第五类构建成功但页面白屏。打开控制台看有没有 JS 报错。常见原因是环境变量在构建时没注入导致前端拿不到NEXT_PUBLIC_SITE_URL。解决方法是把构建命令改成先加载环境变量再构建或者在平台侧把变量标记为构建时可用。这几类覆盖了大部分情况。遇到没见过的报错别慌把完整报错信息复制给 Codex让它分析。Agent 处理这类问题的能力比你想的强。6. 把部署链路固化下来后续更新与长期维护第一次部署跑通之后后面每次更新内容或改代码你不需要再从头走一遍。把部署命令固化成一个脚本或者直接让 Codex 记住你的部署流程下次一句话就能重新发布。CloudBase 路线的话更新就是重新跑一次 CLI 部署命令它会自动构建并上传新版本。自建服务器的话可以用 Git 拉取最新代码再重启服务cd /var/www/blog git pull origin main npm install npm run build pm2 restart blog用 pm2 管理 Node 进程能保证服务挂了自动重启。记得把 pm2 加入开机自启否则服务器重启后网站就打不开了。域名和证书这块设置好自动续期就不用管了。CloudBase 的证书自动管理自建服务器用 certbot 的--renew-hook配合 cron。数据库记得定期备份CloudBase 有自动备份选项自建的话写个定时脚本导出。如果你后续要接更多模型能力比如换模型、加 Agent 任务TaoToken 的 Coding Planhttps://taotoken.net/coding-plan可以看下适合长期编码场景。接入文档https://taotoken.net/doc里有完整的参数说明遇到接口层面的问题先翻文档。最后说一句实在的部署这件事第一次会觉得步骤多走通一遍之后就会发现核心就是代码上云、域名指向、HTTPS 加密这三件事。剩下的都是细节交给 Agent 处理就行。你的 Vibe Coding 产品值得被更多人看到。