Chitchatter Cloudflare 部署指南
前提条件
- Cloudflare 账户
- GitHub 账户 (推荐)
- 基本的命令行知识
- Node.js 和 npm 已安装在本地开发环境中
第一部分: 部署到 Cloudflare Pages
方法 1: 通过 GitHub 直接部署
-
Fork Chitchatter 仓库
访问 GitHub - jeremyckahn/chitchatter: Secure peer-to-peer chat that is serverless, decentralized, and ephemeral 并 fork 仓库到您的 GitHub 账户。
-
登录 Cloudflare 控制台
前往 https://dash.cloudflare.com/ 并登录您的账户。
-
创建 Pages 项目
- 在侧边栏中点击 “Pages”
- 点击 “创建应用程序”
- 选择 “连接到 Git”
- 授权并连接您的 GitHub 账户
- 从列表中选择您 fork 的 Chitchatter 仓库
-
配置构建设置
填写以下信息:
项目名称: chitchatter (或您想要的名称) 生产分支: main 或 develop 构建命令: npm run build 构建输出目录: dist
-
高级设置
添加以下环境变量:
NODE_VERSION: 18
-
保存并部署
点击 “保存并部署” 按钮启动初始构建。构建过程将会被跟踪,完成后您会看到部署 URL。
方法 2: 手动部署
如果您不想连接 GitHub 仓库,可以使用 Wrangler CLI 工具手动部署:
-
安装 Wrangler CLI
npm install -g wrangler
-
登录到 Cloudflare
wrangler login
-
克隆仓库并构建
git clone https://github.com/jeremyckahn/chitchatter.git cd chitchatter npm install npm run build
-
创建配置文件
在项目根目录创建
wrangler.toml
文件:name = "chitchatter" type = "webpack" account_id = "您的账户ID" workers_dev = true route = "" zone_id = "" [site] bucket = "./build" entry-point = "workers-site"
-
部署到 Cloudflare Pages
wrangler pages publish build --project-name chitchatter
第三部分: 配置和自定义域名
-
设置自定义域名
- 在 Cloudflare Pages 项目设置中,导航到 “自定义域”
- 点击 “设置自定义域”
- 输入您想要使用的域名 (该域名必须已添加到您的 Cloudflare 账户中)
- 按照指示完成 DNS 配置
-
配置 HTTPS
Cloudflare Pages 自动配置 HTTPS,无需额外设置。
第四部分: 高级配置
环境变量
对于不同的部署环境,您可以在 Cloudflare Pages 控制台中配置环境变量:
- 导航到您的项目
- 点击 “设置” > “环境变量”
- 添加需要的环境变量
持续部署
当您通过 GitHub 连接时,每当您推送到指定分支,Cloudflare Pages 将自动重新部署您的应用程序。
故障排除
-
构建失败
- 检查 Node.js 版本兼容性
- 检查构建日志中的错误
-
P2P 连接问题
- 确保您使用的是 HTTPS (Cloudflare Pages 默认提供)
- WebRTC 在某些环境中可能受限,确认您的用户可以使用 WebRTC
-
Worker 连接问题
- 检查 Worker 日志
- 验证 Worker 路由配置是否正确