# 青屿书屋（GitHub Pages + Supabase 小说站）

这是一个可安装为 PWA 的小说阅读站。它有两种运行方式：

| 模式 | 适用场景 | 内容来源 |
| --- | --- | --- |
| 本地静态模式（默认） | 只想在 GitHub Pages 上快速发布作品 | `data/books.json` 和 `data/chapters/` |
| Supabase 云端模式 | 需要账号、跨设备书架、评论与网站后台发布 | Supabase PostgreSQL |

连接 Supabase 后，手机浏览器可以“添加到主屏幕”作为 App 使用；用户的登录会话、书架与阅读进度将保存在自己的账号中。

> 仅发布你原创、已获授权或属于公共领域的内容。请勿上传或转载未经许可的小说、个人隐私或违法有害内容。

## 启用 Supabase（推荐）

### 1. 新建项目并创建数据库

1. 在 [Supabase Dashboard](https://supabase.com/dashboard) 新建一个 Project。
2. 打开 **SQL Editor → New query**，将 [`supabase/schema.sql`](supabase/schema.sql) 的全部内容粘贴进去并执行。
3. 打开 **Authentication → URL Configuration**：
   - **Site URL** 填你的线上地址，例如 `https://你的用户名.github.io/qingyu-reader/`。
   - **Redirect URLs** 增加 `https://你的用户名.github.io/qingyu-reader/*`；本地测试可增加 `http://localhost:8000/*`。
4. 在 **Connect** 中复制项目的 **Project URL** 和 **publishable key**（旧项目显示为 anon key）。

### 2. 连接网站

编辑根目录的 [`config.js`](config.js)：

```js
window.QINGYU_SUPABASE_CONFIG = {
  url: 'https://你的项目.supabase.co',
  anonKey: '你的-publishable-或-anon-key'
};
```

这个 key 可以公开放在 GitHub Pages 中；数据库安全性由 `schema.sql` 的 Row Level Security（RLS）策略保护。**绝对不要**使用或提交 `service_role` / `secret` key。

完成后刷新页面，页首的“本地模式”会变为“登录”。此时书城从 Supabase 读取，原先 `data/` 内的示例数据不再展示。

### 3. 创建并授予管理员账号

1. 在网站点击“登录 → 去注册”，使用你的邮箱注册并完成验证。
2. 到 Supabase **Authentication → Users** 复制这个用户的 User UID。
3. 回到 SQL Editor，执行（替换 UUID）：

```sql
update public.profiles
set is_admin = true
where id = '你的-User-UID';
```

重新登录后，页面右上方会出现“后台”。后台可新建小说、发布章节，以及保存草稿。发布内容后会自动出现在书城。

如果你是在运行 SQL 脚本前就已创建了账号，请先补建资料行：

```sql
insert into public.profiles (id, display_name)
select id, coalesce(split_part(email, '@', 1), '书友')
from auth.users
on conflict (id) do nothing;
```

### 权限设计

- 未登录读者只能阅读公开小说、公开章节与公开评论。
- 登录读者只能读取、增删自己的书架；阅读时会更新该书在云端的进度。
- 登录读者只能发布自己的可见评论；管理员可在数据库中管理评论。
- 只有 `profiles.is_admin = true` 的用户能发布或编辑小说、章节。该判断在数据库 RLS 中执行，不能靠修改网页绕过。

## 本地静态模式：添加小说

如果 `config.js` 保持为空，所有书籍资料集中在 `data/books.json`。复制其中一个对象，修改 `id`、`title`、`author`、`category`、`summary` 等字段即可。

每一本书的 `id` 必须唯一。封面使用两种色值即可自动生成，无需另外上传图片：

```json
{
  "id": "my-new-book",
  "title": "我的新小说",
  "author": "作者名",
  "category": "都市",
  "status": "连载中",
  "updated": "今天",
  "latest": "第一章 · 开始",
  "featured": true,
  "cover": "#6c4b72",
  "accent": "#e3a586",
  "summary": "写一句吸引读者的简介。",
  "chapters": [
    { "id": "01", "title": "第一章 开始", "file": "my-new-book-01.txt" }
  ]
}
```

接着在 `data/chapters/` 新建同名文本文件，例如 `my-new-book-01.txt`，填入正文。段落之间留一空行。新增章节时，也要在该书的 `chapters` 数组中增加资料。

## 发布到 GitHub Pages

1. 注册或登录 [GitHub](https://github.com)，点击右上角 **+ → New repository**。
2. 仓库名称可填 `qingyu-reader`，选择 **Public**，然后创建仓库。
3. 将本文件夹内的所有文件上传到仓库根目录，点击 **Commit changes**。Supabase 模式下也要提交填好 URL 与 publishable/anon key 的 `config.js`。
4. 进入仓库 **Settings → Pages**。
5. 在 **Build and deployment** 选择 **Deploy from a branch**，Branch 选择 `main` 和 `/ (root)`，点击 **Save**。
6. 等待约一分钟，GitHub 会显示网站地址。将这个地址补回 Supabase 的 URL Configuration。

之后：静态模式下编辑 JSON / TXT 后提交；Supabase 模式下用网站的“后台”发布，无需再次更新 GitHub。

## 本地预览

不要直接双击 `index.html`，因为浏览器会阻止读取 JSON 和章节文件。在本文件夹终端运行：

```powershell
python -m http.server 8000
```

然后访问 `http://localhost:8000`。若使用 Supabase，本地地址也必须加到 Authentication 的 Redirect URLs。

## 安全提示

- `config.js` 中只可放 Project URL 与 publishable/anon key；它们不是管理员凭据。
- 管理员权限只在 Supabase SQL Editor 中授予，不要在浏览器控制台或前端代码中处理 secret key。
- 启用邮件验证、设置合适的密码策略，并定期查看 Supabase 的 Auth 和 Database 日志。