一个基于 Next.js 16 (App Router) + TypeScript 构建的现代化影视播放与后台管理平台。
- 沉浸式播放：基于 ArtPlayer，支持多种视频格式、来源切换及播放状态记忆。
- 智能发现：精选首页支持触底加载更多（无限滚动）、多维分类筛选、实时搜索及热门趋势。
- 动态交互：剧集详情页支持收藏/取消收藏，实时同步至用户中心。
- 响应式设计：适配 PC 与移动端，提供流畅的跨设备体验。
- 多渠道登录：支持邮箱注册/登录及 GitHub OAuth 第三方登录。
- 安全体系：基于 Better Auth，提供密码重置、邮箱验证等完整流程。
- 个性化中心：管理个人资料、查看播放历史、维护收藏列表。
- 数据可视化：仪表盘展示播放趋势、用户活跃度及内容统计（基于 Recharts）。
- 内容中台：全方位的分类、标签、播放源、剧集内容管理。
- 系统审计：记录关键操作日志，确保系统可追溯性。
| 领域 | 技术方案 |
|---|---|
| 框架 | Next.js 16 (App Router) |
| 语言 | TypeScript |
| 样式 | Tailwind CSS v4 |
| UI 组件 | Radix UI + shadcn/ui |
| 认证 | Better Auth |
| 数据库 | Drizzle ORM + Neon (PostgreSQL) |
| 邮件服务 | Resend |
| 播放器 | ArtPlayer |
| 图表 | Recharts |
drama/
├── app/ # 路由与页面 (包含 API 路由)
│ ├── (auth)/ # 认证相关页面 (登录、注册、后台)
│ ├── (main)/ # 前台展示页面 (首页、分类、详情)
│ └── api/ # 后端 API 接口
├── components/ # 复用组件
│ ├── drama/ # 业务组件
│ ├── layout/ # 布局组件
│ ├── player/ # 播放器封装
│ └── ui/ # 基础 UI 原子组件 (shadcn)
├── db/ # 数据库 Schema 与连接配置
├── lib/ # 核心业务逻辑、服务、工具函数
├── drizzle/ # 数据库迁移脚本
├── public/ # 静态资源
└── styles/ # 全局样式git clone <repository-url>
cd next-drama/drama
pnpm install复制 .env.example 并重命名为 .env，填写必要信息：
# 数据库
DATABASE_URL=
# 认证
BETTER_AUTH_SECRET=
BETTER_AUTH_URL=http://localhost:3000
NEXT_PUBLIC_APP_URL=http://localhost:3000
# GitHub OAuth
GITHUB_CLIENT_ID=
GITHUB_CLIENT_SECRET=
# 邮件服务
RESEND_API_KEY=
MAIL_FROM=pnpm drizzle-kit pushpnpm dev- Lint 检查：运行
pnpm lint保持代码风格一致。 - 类型检查：提交前建议运行
pnpm exec tsc --noEmit。 - 认证控制：可通过环境变量
AUTH_ALLOW_SIGN_UP=false关闭公开注册。
- 智能续播：按剧集粒度记录播放进度，支持跨设备秒级同步续播。
- 播放偏好：记忆倍速、清晰度、自动连播、字幕等用户偏好。
- 片头片尾跳过：支持一键跳过片头/片尾，并可按剧集自动学习时间段。
- 站内消息中心：系统通知、账号安全提醒、内容更新提醒统一收纳。
- 评分与短评：支持剧集评分、短评、点赞及排序筛选。
- 订阅更新：收藏剧集更新时自动推送提醒（站内 + 邮件）。
- 后台可视化开关注册：由管理员在后台实时控制是否开放注册（替代纯环境变量）。
- 角色权限体系（RBAC）：区分超级管理员、内容运营、只读审计等角色。
- 登录风控：异常登录检测、设备管理、可选二次验证（2FA）。
- 多维仪表盘：新增留存、完播率、来源健康度、热门波动等指标。
- 内容运营看板：支持手动置顶、运营推荐位、专题页编排。
- 日志生命周期管理：支持日志归档、自动清理策略与可视化配置。
- 任务队列：将邮件发送、统计聚合、数据清理迁移到异步任务。
- 缓存与降级：来源异常时自动切换备源，提升高峰稳定性。
- 开放 API Key：为外部系统提供受控读取能力（配额与限流）。
本项目采用 MIT License 许可。