From bfc3f089a8bd10bb1a0fe83e8085426067edca5b Mon Sep 17 00:00:00 2001 From: nap0o Date: Sat, 7 Mar 2026 00:43:46 +0800 Subject: [PATCH] =?UTF-8?q?style:=20=E4=BC=98=E5=8C=96=E4=B8=80=E4=BA=9Bcs?= =?UTF-8?q?s=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 62 +++++++++----- backend/package.json | 6 +- .../features/vault/components/appSidebar.vue | 84 ++++++++++++++++++- .../features/vault/components/vaultList.vue | 52 +++++++++++- frontend/src/locales/zh-CN.json | 18 ++-- 5 files changed, 190 insertions(+), 32 deletions(-) diff --git a/README.md b/README.md index d44e6bf..783ada5 100644 --- a/README.md +++ b/README.md @@ -11,12 +11,12 @@ [**Demo演示**](https://2fa.nezha.pp.ua) https://2fa.nezha.pp.ua -- 演示站配置了 `OAUTH_ALLOW_ALL=true`变量, 默认允许任何用户登录,正常部署切记 **不要配置OAUTH_ALLOW_ALL变量** | **不要配置OAUTH_ALLOW_ALL变量** | **不要配置OAUTH_ALLOW_ALL变量** +- 演示站配置了 `OAUTH_ALLOW_ALL=true`变量, 默认允许任何用户登录,正常部署切记 **不要主动配置OAUTH_ALLOW_ALL变量** | **不要主动配置OAUTH_ALLOW_ALL变量** | **不要主动配置OAUTH_ALLOW_ALL变量** - 演示站数据可以任意修改、删除 --- -**2FAuth Worker** 是一个轻量级、安全、无服务器的 TOTP 二步验证管理工具。它让你完全掌控自己的 2FA 数据，支持多端跨平台使用，无需购买任何服务器，**完全免费部署在 Cloudflare 边缘网络上**。 +**2FAuth Worker** 是一个安全、轻量级、无服务器的 TOTP 二步验证管理工具。它让你完全掌控自己的 2FA 数据，支持多端跨平台使用，无需购买任何服务器，**完全免费部署在 Cloudflare 边缘网络上**。 ## ✨ 核心优势与功能 @@ -51,17 +51,7 @@ --- -## 🏗️ 全栈项目架构 - -本项目遵循现代化的 **Feature-based 垂直模块化架构**： - -- **Frontend (Vue 3 + Vite)**：完全模块化，包含 `vault` (账户管理), `backup` (云端灾备), `auth` (身份验证), `tools` (工具箱) 等独立领域模块。状态管理由 Pinia 驱动。 -- **Backend (Hono.js)**：极其轻量的边缘框架。配合 `Drizzle ORM` 丝滑读写 D1 数据库。 -- **前后端天然一体**：由单代码库 (Monorepo) 管理，GitHub Actions 一次触发，同时构建前端产物并以 `Asset/SPA` 模式挂载至 Worker。 - ---- - -## 🚀 极速部署指南 +## 🚀 详细部署指南 本项目设计为通过 **GitHub Actions** 自动化一键部署到你的 Cloudflare 账号下。只需几分钟即可获得你专属的 2FA 管理器。 @@ -69,23 +59,40 @@ 1. 注册一个 [Cloudflare](https://dash.cloudflare.com/) 账号。 2. **Fork** 本仓库到你的 GitHub 账户。 -### 第二步：配置 Cloudflare D1 数据库 +### 第二步：获取 Cloudflare Worker部署令牌 +1. 登录 Cloudflare Dashboard +2. [前往获取](https://dash.cloudflare.com/profile/api-tokens) +3. 点击“创建令牌” +4. 选择使用模版 “编辑 Cloudflare Workers” +5. 配置”帐户资源“和”区域资源“ +6. 依次点击”继续以显示摘要“，点击”创建令牌“ +7. 复制生成的令牌 + +image
+ +image + +### 第三步：配置 Cloudflare D1 数据库 1. 登录 Cloudflare Dashboard。 2. 依次点击左侧菜单的 **存储和数据库** -> **D1 SQL 数据库**。 3. 点击 **创建数据库**，命名为 `2fauth-db` (或自定义名称)。 4. 创建成功后，复制数据库详情页提供的 **`Database ID`**，备用。 -### 第三步：配置第三方登录 -*注：系统支持 6 种登录方式，你**至少需要配置一种***。 +### 第四步：配置第三方登录 +*注：系统支持 6 种登录方式，你**至少需要配置一种***。推荐使用 `GitHub登录` -#### 方案一：使用 GitHub 登录 +#### 使用 GitHub 登录 1. 访问 GitHub `Settings` -> `Developer Settings` -> `OAuth Apps` -> **New OAuth App**。 + 2. 填写应用信息： - **名称**: `2FAuth` - **Homepage URL**: 填入你预期的站点域名，例如 `https://2fa.yourdomain.workers.dev` (部署后可绑定自定义域名) - - **Authorization callback URL**: 重点！必须填写 `https://<你的域名>/oauth/callback` + - **Authorization callback URL**: 重点！必须填写 `https:///oauth/callback` + 3. 保存生成的 **`Client ID`** 和 **`Client Secret`**。 +image + #### 方案二：使用 Telegram 登录 1. 在 Telegram 中搜索并添加官方机器人 **[@BotFather](https://t.me/BotFather)**。 2. 发送 `/newbot` 指令，按照提示为你的 2FAuth 创建一个机器人，并获取它的 **`Bot Token`**（如 `123456:ABC-DEF1234ghIkl-zyx57W2v1u123ew11`）。 @@ -96,14 +103,14 @@ curl "https://api.telegram.org/bot<你的BotToken>/setWebhook?url=https://<你设置的setdomain>/api/telegram/webhook" ``` -### 第四步：配置 GitHub Actions Secrets +### 第五步：配置 GitHub Actions Secrets 前往你 Fork 的 GitHub 仓库的 **Settings** -> **Secrets and variables** -> **Actions** -> **New repository secret**，添加以下必填环境变量： #### ☁️ 必填：Cloudflare 资源授权 | Secret Name | 说明 | 示例值 | | :--- | :--- | :--- | | `CLOUDFLARE_ACCOUNT_ID` | 你的 CF 账户 ID | `a1b2c3d4e5f6g7h8i9j0` (CF 面板的概述页右下角) | -| `CLOUDFLARE_API_TOKEN` | CF 部署令牌 [前往获取](https://dash.cloudflare.com/profile/api-tokens)
点击“创建令牌” -> “创建自定义令牌”
权限 1: **账户** -> **D1** -> **编辑**
权限 2: **账户** -> **Workers 脚本** -> **编辑** | `r4_xyz...` | +| `CLOUDFLARE_API_TOKEN` | CF 部署令牌 | `r4_xyz...` | #### 🔐 必填：系统安全参数 @@ -136,6 +143,8 @@ curl "https://api.telegram.org/bot<你的BotToken>/setWebhook?url=https://<你 | **Gitee** | `OAUTH_GITEE_CLIENT_ID`
`bcd...` | `OAUTH_GITEE_CLIENT_SECRET`
`efg...` | `OAUTH_GITEE_REDIRECT_URI`
`https://xxx.workers.dev/oauth/callback` | | **NodeLoc** | `OAUTH_NODELOC_CLIENT_ID`
`cde...` | `OAUTH_NODELOC_CLIENT_SECRET`
`fgh...` | `OAUTH_NODELOC_REDIRECT_URI`
`https://xxx.workers.dev/oauth/callback` | +image + ### 第五步：触发自动化部署 1. 进入你的 GitHub 仓库的 **Actions** 页面。 2. 找到 `Deploy to Cloudflare Workers` 工作流。 @@ -146,6 +155,9 @@ curl "https://api.telegram.org/bot<你的BotToken>/setWebhook?url=https://<你 - ⚡ 自动将带有静态前端的后端服务绑定至 Cloudflare 边缘节点。 5. 部署成功后，控制台会输出你的 `xxx.workers.dev` 链接。登录进去，开始你的私有化 2FA 之旅！ +image + + --- ## 💻 本地极客开发 (Local Development) @@ -170,6 +182,16 @@ npx wrangler d1 execute 2fauth-db-dev --local --env dev --file=schema.sql npm run dev ``` +## 🏗️ 全栈项目架构 + +本项目遵循现代化的 **Feature-based 垂直模块化架构**： + +- **Frontend (Vue 3 + Vite)**：完全模块化，包含 `vault` (账户管理), `backup` (云端灾备), `auth` (身份验证), `tools` (工具箱) 等独立领域模块。状态管理由 Pinia 驱动。 +- **Backend (Hono.js)**：极其轻量的边缘框架。配合 `Drizzle ORM` 丝滑读写 D1 数据库。 +- **前后端天然一体**：由单代码库 (Monorepo) 管理，GitHub Actions 一次触发，同时构建前端产物并以 `Asset/SPA` 模式挂载至 Worker。 + +--- + --- ## 🛡️ 安全性声明 (Security Policy) diff --git a/backend/package.json b/backend/package.json index da34493..4bd8724 100644 --- a/backend/package.json +++ b/backend/package.json @@ -1,5 +1,9 @@ { - "name": "backend", + "name": "2FAuth Worker", + "version": "1.0.2", + "description": "A Secure 2FA Management Tool running on Cloudflare Workers", + "author": "nap0o", + "license": "AGPL-3.0", "type": "module", "scripts": { "dev": "wrangler dev --config wrangler.dev.toml --host 0.0.0.0 --port 8787 --test-scheduled", diff --git a/frontend/src/features/vault/components/appSidebar.vue b/frontend/src/features/vault/components/appSidebar.vue index a97e179..e7b7167 100644 --- a/frontend/src/features/vault/components/appSidebar.vue +++ b/frontend/src/features/vault/components/appSidebar.vue @@ -56,11 +56,29 @@
+ + + { ElMessage.success(t('auth.logout_success')) } + + diff --git a/frontend/src/features/vault/components/vaultList.vue b/frontend/src/features/vault/components/vaultList.vue index fe6974e..632ddb2 100644 --- a/frontend/src/features/vault/components/vaultList.vue +++ b/frontend/src/features/vault/components/vaultList.vue @@ -1,7 +1,9 @@