# AounApp - 个人资源付费系统

这是一个基于 Next.js 全栈开发的个人资源付费与会员系统。支持文章/资源发布、会员订阅、积分充值、以及支付宝/微信支付集成。

## 🛠 技术栈 (Tech Stack)

### 核心框架
- **Framework**: [Next.js 16](https://nextjs.org/) (Pages Router)
- **Language**: [TypeScript](https://www.typescriptlang.org/)
- **Database**: [MongoDB](https://www.mongodb.com/) (via [Mongoose](https://mongoosejs.com/))

### 前端 UI & 交互
- **UI Library**: [Shadcn UI](https://ui.shadcn.com/) (基于 Radix UI)
- **Styling**: [Tailwind CSS v4](https://tailwindcss.com/)
- **Icons**: [Lucide React](https://lucide.dev/)
- **Forms**: [React Hook Form](https://react-hook-form.com/) + [Zod](https://zod.dev/) (验证)
- **Notifications**: [Sonner](https://sonner.emilkowal.ski/)
- **Editor**: [Tiptap](https://tiptap.dev/) (Headless 富文本编辑器)

### 后端 & 工具
- **Authentication**: JWT (JSON Web Tokens) - 自定义实现，存储于 HttpOnly Cookie
- **Payment**: Native Alipay Integration (Node.js `crypto` 实现，无第三方 SDK 依赖)
- **Markdown Processing**: 
    - `unified`, `remark`, `rehype` (服务端处理)
    - `shiki` (代码高亮)
- **Date Handling**: `date-fns`

## ✨ 核心功能 (Key Features)

1.  **用户系统**
    - 注册/登录 (JWT)
    - 个人中心 (Dashboard)：查看订单、会员状态、积分
    - 钱包系统：积分充值与消费

2.  **内容管理 (CMS)**
    - **文章/资源发布**：支持 Markdown 编辑 (Tiptap)，支持设置价格（积分/现金）、隐藏内容（下载链接/提取码）。
    - **分类与标签**：灵活的内容组织。
    - **评论系统**：支持多级评论。

3.  **会员与支付**
    - **会员订阅**：不同等级会员享受不同折扣和每日下载限制。
    - **支付集成**：
        - **支付宝**：原生集成，支持当面付/电脑网站支付（根据配置）。
        - **积分支付**：站内虚拟货币支付。
    - **订单系统**：完整的订单创建、支付回调、状态流转。

4.  **管理后台 (Admin)**
    - 仪表盘：数据概览。
    - 用户管理、文章管理、订单管理、会员套餐管理。
    - 系统设置：全局 SEO、支付参数配置。

## ⚠️ 关键架构与注意事项 (Architecture & Notes)

### 1. Markdown 渲染架构
*   **服务端渲染 (SSR)**：为了解决 `rehype-pretty-code` 在客户端运行时的兼容性问题，并将繁重的 Markdown 解析逻辑移出前端 bundle，我们采用了**服务端预处理**方案。
*   **流程**：
    1.  API (`/api/articles/[id]`) 接收请求。
    2.  后端读取 Markdown 内容，使用 `unified` + `remark` + `rehype` + `shiki` 转换为 HTML。
    3.  API 返回预渲染好的 HTML 字符串。
    4.  前端 (`pages/article/[id].tsx`) 使用 `dangerouslySetInnerHTML` 直接渲染。

### 2. 编辑器 (Tiptap)
*   **SSR 兼容性**：Tiptap 在 Next.js 中使用时，必须在 `useEditor` 中设置 `immediatelyRender: false`，以避免服务端渲染与客户端水合不匹配 (Hydration Mismatch) 导致的运行时错误。
*   **Markdown 支持**：集成了 `tiptap-markdown` 扩展，确保编辑器内容可以作为 Markdown 格式保存到数据库，保持数据格式的通用性。

### 3. 支付系统
*   **去 SDK 化**：为了避免 `alipay-sdk` 等库的潜在依赖问题和体积，我们使用 Node.js 原生 `crypto` 模块实现了支付宝的签名和验签逻辑 (`src/lib/alipay.ts`)。
*   **安全性**：支付回调 (`notify`) 必须严格验证签名，防止伪造请求。

### 4. 样式系统
*   **Tailwind v4**：项目配置了 Tailwind CSS v4。
*   **Typography**：使用了 `@tailwindcss/typography` 插件来美化文章详情页的 HTML 内容渲染 (`prose` 类)。

## 🚀 快速开始 (Getting Started)

1.  **安装依赖**
    ```bash
    pnpm install
    ```

2.  **配置环境变量**
    复制 `.env.example` 到 `.env.local` 并填入 MongoDB URI 和 JWT Secret 等信息。

3.  **运行开发服务器**
    ```bash
    pnpm run dev
    ```

4.  **访问**
    - 前台: `http://localhost:3000`
    - 后台: `http://localhost:3000/admin`