Growth App 知识库

CF Vibe SDK 部署手册 — Hostinger VPS 部署到 Cloudflare Workers

6分钟阅读

CF Vibe SDK 部署手册

TL;DR

在 Hostinger VPS (srv1247016) 上克隆 VibeSDK 源码，通过 npm run setup 交互配置 Cloudflare 资源，最终部署为 CF Workers。用户通过 GitHub OAuth 登录，用自然语言生成 Web 应用。

现状：✅ 已部署到 vibe.gottenergy.com。GitHub OAuth 登录正常。缺 Google AI key（代码生成不可用）、Workers for Platforms（自动部署不可用）。

🎯 背景：为什么需要这个

  • 需求：老师要求部署 Cloudflare 官方的 AI 代码生成平台，用于快速生成内部工具或客户页面
  • 卡点：VibeSDK 需要 Node v22+、Bun、Workers Paid Plan。Ubuntu 22.04 自带 Node v18 不够
  • 约束：部署到 Gott Energy 的 Cloudflare 账号下，使用 gottenergy.com 子域

✅ 前置条件

  • Cloudflare Workers Paid Plan（$5/月）
  • CF API Token（Containers/D1/R2/KV/Workers Scripts/Workers Routes 权限）
  • GitHub OAuth App（Client ID + Secret）
  • 域名 vibe.gottenergy.com
  • Hostinger VPS SSH 访问

🏗️ 最终架构

用户浏览器 → vibe.gottenergy.com
  → CF Workers (vibesdk-production)
    → D1 数据库 (vibesdk-db)
    → R2 存储 (vibesdk-templates)
    → KV (vibesdk-vibecoderstore-local)
    → CF Containers (standard-3, 沙箱预览)
    → GitHub OAuth (登录)

🛠️ 部署步骤

第 1 步：环境准备（Hostinger VPS）

curl -fsSL https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.1/install.sh | bash
source ~/.bashrc
nvm install 22
node --version  # v22.23.1

第 2 步：克隆并安装依赖

cd /opt
git clone https://github.com/cloudflare/vibesdk.git
cd vibesdk
npm install -g bun
bun install

第 3 步：交互式配置

npm run setup

按提示填入：

配置项值
Cloudflare Account ID填对应Account
CF API TokenVibeSDK Token（Containers/D1/R2/KV/Workers Edit）
Custom Domainvibe.gottenergy.com
Remote ResourcesY
Production DeployY
AI GatewayY（默认 URL）
AI Provider选AI服务商，填key
GOOGLE_CLIENT_ID可选
GITHUB_CLIENT_IDGitHub OAuth App Client ID
GITHUB_CLIENT_SECRETGitHub OAuth App Client Secret
GITHUB_EXPORTER_CLIENT_IDGitHub Export OAuth App Client ID
GITHUB_EXPORTER_CLIENT_SECRETGitHub Export OAuth App Client Secret

第 4 步：Token 权限问题

Setup 过程中需要：

  1. CF Token IP 限制需同时添加 IPv4 + IPv6：145.223.73.35/32 和 2a02:4780:2d:4b6e::1/128
  2. 远程 D1 迁移需要 Token：export CLOUDFLARE_API_TOKEN=... && cd /opt/vibesdk && bun run db:migrate:remote
  3. 部署时需 Zone 级 Workers Routes → Edit 权限

第 5 步：部署上线

cd /opt/vibesdk && npm run deploy

部署会自动：

  • 构建 Worker + 前端
  • 推送容器镜像到 CF Registry
  • 上传模板到 R2
  • 同步 D1 数据库
  • 创建 Worker Routes

↩️ 回滚 / 卸载

  • 删除 Worker：CF Dashboard → Workers & Pages → vibesdk-production → Delete
  • 删除资源：D1 vibesdk-db、R2 vibesdk-templates、KV vibesdk-vibecoderstore-local
  • 删除 Token：CF Dashboard → API Tokens → VibeSDK → Delete
  • 清理 VPS：rm -rf /opt/vibesdk
  • 回滚后验证：访问 vibe.gottenergy.com 应返回 404/522

🔍 验证方法

  1. 打开 https://vibe.gottenergy.com
  2. 点击 “Sign in with GitHub” → GitHub 授权 → 进入主界面
  3. 输入自然语言描述（如 “Build a hello world page”）→ 生成代码 → 预览

🕳️ 踩过的坑

⚠️ 已知限制 / 副作用

  • Google AI key 未配，AI 代码生成功能不可用
  • Workers for Platforms 未开通，Dispatch 功能不可用（用户生成的 app 不能一键部署到独立域名）
  • ALLOWED_EMAIL 目前为空，任何人能用 GitHub 登录。建议设白名单
  • 代码生成后的项目存储在 CF D1/R2 上，不会推送到用户 GitHub（除非用了 Exporter 功能）

🔒 安全 & 成本速查

  • Token 权限：Containers/D1/R2/KV/Workers Scripts/Workers Routes 全部 Edit
  • Token IP 限制：145.223.73.35/32 + 2a02:4780:2d:4b6e::1/128
  • 月度成本：Workers Paid $5 + 按量（Container 标准实例空闲零费用）

📌 待办 / 未来优化方向

  • 配 Google AI key 启用代码生成
  • 开通 Workers for Platforms 启用自动部署
  • 设 ALLOWED_EMAIL 白名单
  • 监控 CF 账单（Container 按 CPU 计费）

📋 速查命令合集

cd /opt/vibesdk
npm run dev          # 本地开发
npm run deploy       # 生产部署
bun run db:migrate:remote   # 远程 D1 迁移

📝 更新日志

日期改动原因
2026-07-10首次创建，完成部署老师要求

关系图谱