自托管项目——私密聊天室Chitchatter 部署指南

星河书院
,
1

Chitchatter Cloudflare 部署指南

前提条件

  • Cloudflare 账户
  • GitHub 账户 (推荐)
  • 基本的命令行知识
  • Node.js 和 npm 已安装在本地开发环境中

第一部分: 部署到 Cloudflare Pages

方法 1: 通过 GitHub 直接部署

  1. Fork Chitchatter 仓库

    访问 GitHub - jeremyckahn/chitchatter: Secure peer-to-peer chat that is serverless, decentralized, and ephemeral 并 fork 仓库到您的 GitHub 账户。

  2. 登录 Cloudflare 控制台

    前往 https://dash.cloudflare.com/ 并登录您的账户。

  3. 创建 Pages 项目

    • 在侧边栏中点击 “Pages”
    • 点击 “创建应用程序”
    • 选择 “连接到 Git”
    • 授权并连接您的 GitHub 账户
    • 从列表中选择您 fork 的 Chitchatter 仓库

  4. 配置构建设置

    填写以下信息:

    项目名称: chitchatter (或您想要的名称)
生产分支: main 或 develop
构建命令: npm run build
构建输出目录: dist

  5. 高级设置

    添加以下环境变量:

    NODE_VERSION: 18

  6. 保存并部署

    点击 “保存并部署” 按钮启动初始构建。构建过程将会被跟踪，完成后您会看到部署 URL。

方法 2: 手动部署

如果您不想连接 GitHub 仓库，可以使用 Wrangler CLI 工具手动部署:

  1. 安装 Wrangler CLI

    npm install -g wrangler

  2. 登录到 Cloudflare

    wrangler login

  3. 克隆仓库并构建

    git clone https://github.com/jeremyckahn/chitchatter.git
cd chitchatter
npm install
npm run build

  4. 创建配置文件

    在项目根目录创建 wrangler.toml 文件:

    name = "chitchatter"
type = "webpack"
account_id = "您的账户ID"
workers_dev = true
route = ""
zone_id = ""

[site]
bucket = "./build"
entry-point = "workers-site"

  5. 部署到 Cloudflare Pages

    wrangler pages publish build --project-name chitchatter

第三部分: 配置和自定义域名

  1. 设置自定义域名

    • 在 Cloudflare Pages 项目设置中，导航到 “自定义域”
    • 点击 “设置自定义域”
    • 输入您想要使用的域名 (该域名必须已添加到您的 Cloudflare 账户中)
    • 按照指示完成 DNS 配置

  2. 配置 HTTPS

    Cloudflare Pages 自动配置 HTTPS，无需额外设置。

第四部分: 高级配置

环境变量

对于不同的部署环境，您可以在 Cloudflare Pages 控制台中配置环境变量:

  1. 导航到您的项目
  2. 点击 “设置” > “环境变量”
  3. 添加需要的环境变量

持续部署

当您通过 GitHub 连接时，每当您推送到指定分支，Cloudflare Pages 将自动重新部署您的应用程序。

故障排除

  1. 构建失败

    • 检查 Node.js 版本兼容性
    • 检查构建日志中的错误

  2. P2P 连接问题

    • 确保您使用的是 HTTPS (Cloudflare Pages 默认提供)
    • WebRTC 在某些环境中可能受限，确认您的用户可以使用 WebRTC

  3. Worker 连接问题

    • 检查 Worker 日志
    • 验证 Worker 路由配置是否正确

参考资源