实时追踪虚拟币、股市、贵金属价格的PWA应用，支持移动端使用。
- 虚拟币价格追踪（Binance/OKX/Bitget/MEXC）
- Binance Alpha代币支持
- MEME币支持（BSC/ETH/SOL/Base）
- A股/港股/美股行情
- 贵金属价格（黄金/白银）
- 响应式设计适配移动端
- PWA支持离线访问
- 配置导入导出
- 云端同步（规划中）
┌─────────────────────────────────────────────────────────────────────┐
│ 用户设备 │
├──────────────────────────┬──────────────────────────────────────────┤
│ Chrome插件 │ PWA网页 │
│ ┌─────────────────┐ │ ┌─────────────────┐ │
│ │ 本地存储 │ │ │ localStorage │ │
│ │ (Chrome Storage)│ │ │ │ │
│ └────────┬────────┘ │ └────────┬────────┘ │
│ │ │ │ │
│ ┌────────▼────────┐ │ ┌────────▼────────┐ │
│ │ 导入/导出JSON │ │ │ 导入/导出JSON │ ← 现有功能保留 │
│ └────────┬────────┘ │ └────────┬────────┘ │
│ │ │ │ │
│ ┌────────▼──────────────┴──────────────▼────────┐ │
│ │ 云同步模块（新增） │ │
│ │ ┌─────────┐ ┌─────────┐ ┌─────────┐ │ │
│ │ │同步密码 │ │拉取云端 │ │推送云端 │ │ │
│ │ └─────────┘ └─────────┘ └─────────┘ │ │
│ └────────────────────┬─────────────────────────┘ │
└───────────────────────┼─────────────────────────────────────────────┘
│ HTTPS (密码验证)
▼
┌───────────────────────────────────────────────────────────────────┐
│ Cloudflare Workers │
│ ┌─────────────────────────────────────────────────────────────┐ │
│ │ 环境变量（安全存储，前端不可见） │ │
│ │ - USER_PASSWORD: "你设置的同步密码" │ │
│ │ - GITHUB_TOKEN: "ghp_xxxxxxxxxxxx" │ │
│ │ - GITHUB_REPO: "cosimawei/my-private-config" │ │
│ └─────────────────────────────────────────────────────────────┘ │
│ │
│ API端点： │
│ GET /sync?pwd=xxx → 获取配置 │
│ POST /sync?pwd=xxx → 更新配置 │
└──────────────────────────┬────────────────────────────────────────┘
│ GitHub API
▼
┌───────────────────────────────────────────────────────────────────┐
│ GitHub 私有仓库 │
│ cosimawei/my-private-config (Private) │
│ └── config.json │
│ { │
│ "version": "1.0", │
│ "lastUpdate": "2025-12-03T10:00:00Z", │
│ "data": { ... } │
│ } │
└───────────────────────────────────────────────────────────────────┘
现有设置（保留）：
┌─────────────────────────────────────┐
│ 💾 配置备份与恢复 │
│ │
│ [📤 导出配置] [📥 导入配置] │ ← 保留，用于本地备份
└─────────────────────────────────────┘
新增设置：
┌─────────────────────────────────────┐
│ ☁️ 云端同步 │
│ │
│ 同步密码: [**********] │
│ 同步地址: [https://xxx.workers.dev] │
│ │
│ [保存配置] │
│ │
│ 状态: ✅ 已连接 / ❌ 未配置 │
│ 上次同步: 2025-12-03 10:00:00 │
│ │
│ [⬇️ 拉取云端] [⬆️ 推送云端] │
│ │
│ ⚠️ 拉取会覆盖本地，推送会覆盖云端 │
└─────────────────────────────────────┘
- 访问 https://github.com/new
- 仓库名称:
my-private-config - 选择 Private
- 创建仓库
- 访问 GitHub Settings → Developer settings → Personal access tokens
- Generate new token (classic)
- 勾选
repo权限 - 复制生成的
ghp_xxxxxxxx
- 登录 Cloudflare Dashboard
- 创建新的 Worker
- 部署提供的 Worker 代码
- 设置环境变量：
USER_PASSWORD: 你的同步密码（自己设置）GITHUB_TOKEN:ghp_xxxxxxxxGITHUB_REPO:你的用户名/my-private-config
- 打开设置 → 云端同步
- 填入同步密码
- 填入同步地址:
https://xxx.workers.dev - 点击保存
| 场景 | 操作 |
|---|---|
| 添加了新代币想同步 | 点击 [⬆️ 推送云端] |
| 在其他设备想获取最新配置 | 点击 [⬇️ 拉取云端] |
| 换新电脑/重装插件 | 填入密码和地址 → 点击 [⬇️ 拉取云端] |
GET /sync?pwd=你的密码
Response:
{
"success": true,
"data": {
"version": "1.0",
"lastUpdate": "2025-12-03T10:00:00Z",
"data": { ... }
}
}
POST /sync?pwd=你的密码
Content-Type: application/json
Body:
{
"version": "1.0",
"lastUpdate": "2025-12-03T10:00:00Z",
"data": { ... }
}
Response:
{
"success": true,
"message": "配置已更新"
}
| 敏感信息 | 存储位置 | 是否暴露给前端 |
|---|---|---|
| GitHub Token | CF Workers环境变量 | ❌ 不暴露 |
| 同步密码 | CF Workers环境变量 + 用户本地 | 用户自己知道 |
| 配置内容 | GitHub私有仓库 | 仅通过密码验证后可访问 |
┌─────────────────────────────────────────────────────────┐
│ 配置管理 │
├─────────────────────────────────────────────────────────┤
│ │
│ 本地存储 ←──读写──→ 插件/网页运行时 │
│ │ │
│ ├──── 导出 ────→ JSON文件（下载到本地） [现有功能] │
│ │ │
│ ├──── 导入 ←──── JSON文件（从本地选择） [现有功能] │
│ │ │
│ ├──── 推送 ────→ 云端GitHub仓库 [新增功能] │
│ │ │
│ └──── 拉取 ←──── 云端GitHub仓库 [新增功能] │
│ │
└─────────────────────────────────────────────────────────┘
三种方式互不冲突：
- 只用本地导入导出（离线备份）
- 只用云端同步（多设备同步）
- 两者结合使用
- Fork 本仓库
- 在 Cloudflare Pages 创建新项目
- 连接 GitHub 仓库
- 部署
- Fork 本仓库
- 启用 GitHub Pages
- 选择 main 分支
# 克隆仓库
git clone https://github.com/cosimawei/web3toolspwa.git
# 使用任意 HTTP 服务器运行
npx serve .
# 或
python -m http.server 8080├── index.html # 主页面
├── app.js # 应用逻辑
├── styles.css # 样式
├── manifest.json # PWA配置
├── sw.js # Service Worker
└── icons/ # 图标
MIT