diff --git a/DANMAKU_INTEGRATION.md b/DANMAKU_INTEGRATION.md deleted file mode 100644 index 1c3eff7..0000000 --- a/DANMAKU_INTEGRATION.md +++ /dev/null @@ -1,254 +0,0 @@ -# LunaTV 弹幕功能集成说明 - -## 概述 - -LunaTV 已成功集成弹幕功能,支持自动搜索、手动选择和实时显示弹幕。弹幕数据来自 danmu_api 项目。 - -## 前置条件 - -### 1. 启动 danmu_api 服务 - -在使用弹幕功能之前,需要先启动 danmu_api 服务: - -```bash -cd D:\projects\danmu_api -npm install -npm start -``` - -默认情况下,danmu_api 服务将在 http://localhost:9321 启动。 - -### 2. 配置环境变量(可选) - -弹幕请求通过 LunaTV 后端代理转发,需要在后端配置 danmu_api 的地址。 - -如果您的 danmu_api 服务运行在不同的地址或使用了自定义 token,可以在项目根目录创建 `.env.local` 文件: - -```env -# 弹幕 API 地址(默认: http://localhost:9321) -DANMAKU_API_BASE=http://localhost:9321 - -# 弹幕 API Token(默认: 87654321) -DANMAKU_API_TOKEN=87654321 -``` - -**注意**: -- 环境变量配置的是服务端地址,不是浏览器端 -- 如果 danmu_api 和 LunaTV 在同一台机器,使用默认配置即可 -- 如果在不同机器,请使用完整的 URL(如 `http://192.168.1.100:9321`) - -## 功能特性 - -### 1. 弹幕选项卡 - -- 位置:视频播放页面,在"选集"和"换源"选项卡之上 -- 功能: - - 搜索动漫弹幕 - - 浏览搜索结果 - - 选择剧集并加载弹幕 - - 显示当前选择的弹幕信息 - -### 2. 自动搜索弹幕 - -- 视频播放时自动根据视频标题搜索并加载弹幕 -- 自动记忆上次选择的弹幕源 -- 根据当前集数智能匹配对应的弹幕 - -### 3. 弹幕播放器控制 - -在播放器设置菜单中提供以下弹幕控制选项: - -#### 弹幕开关 -- 一键开启/关闭弹幕显示 - -#### 弹幕不透明度 -- 10%、25%、50%、75%、100% 五档可选 -- 默认:75% - -#### 弹幕字体大小 -- 小(20px) -- 中(25px,默认) -- 大(30px) -- 特大(35px) - -#### 弹幕速度 -- 很慢、慢(默认)、正常、快、很快 - -### 4. 弹幕记忆功能 - -- 自动记忆每个视频的弹幕选择 -- 下次播放同一视频时自动加载上次选择的弹幕 -- 最多保存 100 个视频的弹幕选择记录 - -## 使用方法 - -### 手动搜索和选择弹幕 - -1. 打开视频播放页面 -2. 点击"弹幕"选项卡 -3. 在搜索框输入动漫名称 -4. 点击"搜索"按钮 -5. 在搜索结果中选择对应的动漫 -6. 在剧集列表中选择当前集数 -7. 弹幕会自动加载到播放器 - -### 自动搜索弹幕 - -- 视频播放时,系统会自动根据视频标题搜索弹幕 -- 如果找到匹配的弹幕,会自动加载到播放器 -- 如果有记忆的弹幕选择,会优先使用记忆的选择 - -### 控制弹幕显示 - -1. 点击播放器右下角的设置按钮 -2. 在设置菜单中找到"弹幕开关" -3. 点击切换弹幕显示/隐藏 -4. 可调整弹幕不透明度、字体大小、速度等参数 - -## 技术实现 - -### 架构设计 - -弹幕功能采用后端代理模式,所有弹幕请求通过 Next.js API 路由转发到 danmu_api: - -``` -前端组件 → Next.js API 路由 (代理) → danmu_api 服务 → 返回数据 -``` - -**优点**: -- 前端不直接暴露 danmu_api 地址 -- 避免 CORS 跨域问题 -- 可在后端实现缓存和请求控制 -- 更好的安全性 - -### 集成的文件 - -1. **类型定义** - - `src/lib/danmaku/types.ts` - 弹幕相关的类型定义 - -2. **前端 API 封装** - - `src/lib/danmaku/api.ts` - 弹幕 API 客户端(调用本地代理) - -3. **后端代理路由** - - `src/app/api/danmaku/search/route.ts` - 搜索动漫代理 - - `src/app/api/danmaku/episodes/route.ts` - 获取剧集列表代理 - - `src/app/api/danmaku/comment/route.ts` - 获取弹幕代理 - - `src/app/api/danmaku/match/route.ts` - 自动匹配代理 - -4. **弹幕管理面板** - - `src/components/DanmakuPanel.tsx` - 弹幕搜索和选择界面 - -5. **修改的文件** - - `src/components/EpisodeSelector.tsx` - 添加弹幕选项卡 - - `src/app/play/page.tsx` - 集成弹幕到播放器 - -### 使用的插件 - -- `artplayer-plugin-danmuku` - ArtPlayer 官方弹幕插件 - -### 弹幕数据流 - -``` -前端: 视频标题 → 调用 /api/danmaku/search - ↓ -后端代理: → 转发到 danmu_api - ↓ -danmu_api: 搜索弹幕 → 返回动漫列表 - ↓ -前端: 选择动漫 → 调用 /api/danmaku/episodes - ↓ -后端代理: → 转发到 danmu_api - ↓ -danmu_api: → 返回剧集列表 - ↓ -前端: 选择剧集 → 调用 /api/danmaku/comment - ↓ -后端代理: → 转发到 danmu_api - ↓ -danmu_api: → 返回弹幕数据 - ↓ -前端: 转换格式 → 加载到播放器 → 显示弹幕 -``` - -## 注意事项 - -1. **danmu_api 服务必须运行** - - 弹幕功能依赖 danmu_api 服务 - - 确保服务在配置的地址和端口上运行 - - 后端代理会自动转发请求,前端无需配置 - -2. **网络连接** - - LunaTV 服务器必须能够访问 danmu_api 服务 - - 如果 danmu_api 在其他机器,确保网络可达 - - 检查防火墙和端口开放情况 - -3. **环境变量配置** - - 配置在后端(`.env.local`),不是前端 - - 修改配置后需要重启 Next.js 服务器 - - 可参考 `.env.example` 文件 - -4. **弹幕数据源** - - 弹幕数据来自多个视频平台 - - 部分视频可能没有匹配的弹幕 - - 可在 danmu_api 中配置数据源优先级 - -5. **性能考虑** - - 弹幕数量较多时可能影响性能 - - 可通过设置菜单调整弹幕显示数量 - - 后端代理可添加缓存机制(未来实现) - -## 常见问题 - -### Q1: 弹幕无法显示? - -**检查项:** -1. danmu_api 服务是否正常运行? -2. 浏览器控制台是否有错误信息? -3. 是否有匹配的弹幕数据? -4. 弹幕开关是否开启? - -### Q2: 弹幕搜索失败? - -**可能原因:** -1. danmu_api 服务未启动 -2. 后端无法连接到 danmu_api(网络问题) -3. 环境变量配置错误(检查 `.env.local`) -4. 视频标题与弹幕库不匹配 - -**调试方法:** -1. 检查浏览器 Network 标签,查看 `/api/danmaku/search` 请求 -2. 检查服务器日志,查看后端转发是否成功 -3. 直接访问 danmu_api 测试是否正常:`http://localhost:9321/api/v2/search/anime?keyword=测试` - -### Q3: 如何清除弹幕记忆? - -打开浏览器开发者工具,在 Console 中执行: -```javascript -localStorage.removeItem('danmaku_memories'); -``` - -### Q4: 如何重置弹幕设置? - -在 Console 中执行: -```javascript -localStorage.removeItem('danmaku_settings'); -``` - -## 未来改进方向 - -1. 支持弹幕发送功能 -2. 添加弹幕过滤规则编辑界面 -3. 支持更多弹幕数据源 -4. 弹幕显示效果优化 -5. 弹幕高级搜索功能 - -## 相关资源 - -- [danmu_api 项目](D:\projects\danmu_api) -- [ArtPlayer 文档](https://artplayer.org) -- [artplayer-plugin-danmuku 文档](https://github.com/zhw2590582/ArtPlayer/tree/master/packages/artplayer-plugin-danmuku) - ---- - -**版本**: 1.0 -**最后更新**: 2025-12-01 diff --git a/DANMAKU_PROXY_IMPLEMENTATION.md b/DANMAKU_PROXY_IMPLEMENTATION.md deleted file mode 100644 index b5eb9bc..0000000 --- a/DANMAKU_PROXY_IMPLEMENTATION.md +++ /dev/null @@ -1,251 +0,0 @@ -# 弹幕代理转发实现总结 - -## 改进说明 - -已将弹幕 API 请求改为通过 LunaTV 后端代理转发,而不是前端直接 fetch。 - -**最新更新 (2025-12-01)**: 弹幕配置已从环境变量迁移到管理面板的站点配置中,存储在数据库中。 - -## 架构变化 - -### 之前的架构 -``` -前端浏览器 → 直接 fetch → danmu_api (http://localhost:9321) -``` - -**问题**: -- 前端直接暴露 danmu_api 地址 -- 可能存在 CORS 跨域问题 -- 无法在后端做统一的缓存和控制 - -### 现在的架构 -``` -前端浏览器 → Next.js API 路由 (代理) → danmu_api (http://localhost:9321) -``` - -**优点**: -- ✅ 前端不直接暴露 danmu_api 地址 -- ✅ 避免 CORS 跨域问题 -- ✅ 可在后端实现缓存和请求控制 -- ✅ 更好的安全性 -- ✅ 统一的错误处理 -- ✅ 配置存储在数据库中,支持在线修改 - -## 实现的 API 路由 - -创建了 4 个 Next.js API 路由作为代理: - -1. **`/api/danmaku/search`** (GET) - - 搜索动漫 - - 参数: `keyword` - - 转发到: `/api/v2/search/anime` - -2. **`/api/danmaku/episodes`** (GET) - - 获取剧集列表 - - 参数: `animeId` - - 转发到: `/api/v2/bangumi/{animeId}` - -3. **`/api/danmaku/comment`** (GET) - - 获取弹幕数据 - - 参数: `episodeId` 或 `url` - - 转发到: `/api/v2/comment/{episodeId}?format=xml` 或 `/api/v2/comment?url=...&format=xml` - - **特殊处理**: 使用 XML 格式获取完整弹幕数据(避免 JSON 格式丢失数据),后端解析 XML 并转换为 JSON 返回给前端 - -4. **`/api/danmaku/match`** (POST) - - 自动匹配弹幕 - - 参数: `fileName` - - 转发到: `/api/v2/match` - -## 修改的文件 - -### 新增文件 -``` -src/app/api/danmaku/search/route.ts # 搜索动漫代理 -src/app/api/danmaku/episodes/route.ts # 获取剧集代理 -src/app/api/danmaku/comment/route.ts # 获取弹幕代理 -src/app/api/danmaku/match/route.ts # 自动匹配代理 -``` - -### 修改文件 -``` -src/lib/admin.types.ts # 添加弹幕配置类型 -src/lib/config.ts # 添加弹幕配置初始化和自检 -src/app/api/admin/site/route.ts # 添加弹幕配置的保存和读取 -src/app/admin/page.tsx # 添加弹幕配置 UI -src/lib/danmaku/api.ts # 改为调用本地代理 API -DANMAKU_INTEGRATION.md # 更新文档说明 -``` - -## 配置方式变化 - -### 之前(环境变量) -```env -# .env.local -DANMAKU_API_BASE=http://localhost:9321 -DANMAKU_API_TOKEN=87654321 -``` - -### 现在(管理面板配置) - -弹幕配置现在存储在数据库的站点配置中,可以通过管理面板进行修改: - -1. 访问管理面板:`/admin` -2. 展开"站点配置"标签 -3. 在"弹幕配置"部分配置以下项: - - **弹幕 API 地址**: danmu_api 服务器地址(默认: `http://localhost:9321`) - - **弹幕 API Token**: danmu_api 访问令牌(默认: `87654321`) -4. 点击"保存"按钮 - -**优点**: -- ✅ 无需重启服务器即可修改配置 -- ✅ 配置持久化到数据库 -- ✅ 支持在线管理 -- ✅ 更直观的用户界面 - -**注意**:环境变量仍可用作初始配置的后备选项,但优先使用数据库中的配置。 - -## 代码示例 - -### 前端调用(修改后) -```typescript -// src/lib/danmaku/api.ts - -// 搜索动漫 -export async function searchAnime(keyword: string) { - const url = `/api/danmaku/search?keyword=${encodeURIComponent(keyword)}`; - const response = await fetch(url); - return await response.json(); -} - -// 获取弹幕 -export async function getDanmakuById(episodeId: number) { - const url = `/api/danmaku/comment?episodeId=${episodeId}`; - const response = await fetch(url); - return (await response.json()).comments; -} -``` - -### 后端代理(新增) -```typescript -// src/app/api/danmaku/search/route.ts - -export async function GET(request: NextRequest) { - const keyword = request.nextUrl.searchParams.get('keyword'); - - // 转发到 danmu_api - const apiUrl = `${DANMAKU_API_BASE}/api/v2/search/anime?keyword=${keyword}`; - const response = await fetch(apiUrl); - const data = await response.json(); - - return NextResponse.json(data); -} -``` - -## 测试验证 - -```bash -# 类型检查通过 -pnpm typecheck -✓ 无 TypeScript 错误 - -# 编译通过 -pnpm build -✓ 构建成功 -``` - -## 使用说明 - -### 1. 配置弹幕服务(首次使用或更新配置) - -#### 方式一:通过管理面板配置(推荐) - -1. 启动 LunaTV 服务 -2. 访问管理面板:`http://localhost:3000/admin` -3. 展开"站点配置"标签 -4. 滚动到"弹幕配置"部分 -5. 设置以下参数: - - **弹幕 API 地址**: danmu_api 服务器地址(例如:`http://192.168.1.100:9321`) - - **弹幕 API Token**: danmu_api 访问令牌(默认:`87654321`) -6. 点击"保存"按钮 -7. 配置立即生效,无需重启服务器 - -#### 方式二:使用环境变量(作为初始配置) - -如果 danmu_api 不在默认地址,创建 `.env.local`: - -```env -DANMAKU_API_BASE=http://192.168.1.100:9321 -DANMAKU_API_TOKEN=your_custom_token -``` - -**注意**: -- 环境变量仅在首次初始化时使用 -- 一旦在管理面板修改配置,将使用数据库中的配置 -- 环境变量修改需要重启服务器才能生效 - -### 2. 启动服务 - -```bash -# 启动 danmu_api(如果使用) -cd D:\projects\danmu_api -npm start - -# 启动 LunaTV -cd D:\projects\LunaTV -pnpm dev -``` - -### 3. 测试弹幕功能 - -1. 打开视频播放页面 -2. 点击"弹幕"选项卡 -3. 搜索并选择弹幕 -4. 弹幕自动加载到播放器 - -## 注意事项 - -1. **配置管理** - - **推荐**:使用管理面板进行配置,无需重启服务器 - - 配置存储在数据库中,持久化保存 - - 环境变量可用作初始配置的后备选项 - - 修改配置后立即生效 - -2. **网络连接** - - LunaTV 服务器必须能访问 danmu_api - - 如果在不同机器,确保网络可达 - - 检查防火墙设置 - -3. **调试方法** - - 浏览器 Network 标签查看 `/api/danmaku/*` 请求 - - 服务器日志查看后端转发情况 - - 直接访问 danmu_api 测试:`http://localhost:9321/api/v2/search/anime?keyword=测试` - - 在管理面板查看和修改当前配置 - -4. **数据库配置** - - 配置存储在 Redis 数据库中 - - 使用 `NEXT_PUBLIC_STORAGE_TYPE` 环境变量控制存储类型 - - 如果使用 `localstorage`,将无法在管理面板修改配置 - -## 未来改进 - -1. **添加缓存机制** - - 在后端代理层添加 Redis 缓存 - - 减少对 danmu_api 的请求压力 - - 提升响应速度 - -2. **添加请求限流** - - 防止恶意频繁请求 - - 保护 danmu_api 服务 - -3. **添加错误重试** - - 请求失败时自动重试 - - 提高稳定性 - -4. **添加监控和日志** - - 记录所有代理请求 - - 便于排查问题 - ---- - -**完成时间**: 2025-12-01 -**状态**: ✅ 已完成并测试通过 diff --git a/README.md b/README.md index 91422eb..e390fae 100644 --- a/README.md +++ b/README.md @@ -7,13 +7,16 @@ > 🎬 **MoonTVPlus** 是基于 [MoonTV v100](https://github.com/MoonTechLab/LunaTV) 二次开发的增强版影视聚合播放器。它在原版基础上新增了外部播放器支持、视频超分、弹幕系统、评论抓取等实用功能,提供更强大的观影体验。
+ ![Next.js](https://img.shields.io/badge/Next.js-14-000?logo=nextdotjs) ![TailwindCSS](https://img.shields.io/badge/TailwindCSS-3-38bdf8?logo=tailwindcss) ![TypeScript](https://img.shields.io/badge/TypeScript-4.x-3178c6?logo=typescript) ![License](https://img.shields.io/badge/License-MIT-green) ![Docker Ready](https://img.shields.io/badge/Docker-ready-blue?logo=docker) +
+ --- ## 🎉 相对原版新增内容 @@ -297,7 +300,7 @@ NEXT_PUBLIC_DOUBAN_IMAGE_PROXY_TYPE 选项解释: ## 致谢 - [ts-nextjs-tailwind-starter](https://github.com/theodorusclarence/ts-nextjs-tailwind-starter) — 项目最初基于该脚手架。 -- [MoonTV](https://github.com/mtvpls/moontvplus)— 由此启发,再次站在巨人的肩膀上。 +- [MoonTV](https://github.com/MoonTechLab/LunaTV)— 由此启发,再次站在巨人的肩膀上。 - [LibreTV](https://github.com/LibreSpark/LibreTV) — 由此启发,站在巨人的肩膀上。 - [ArtPlayer](https://github.com/zhw2590582/ArtPlayer) — 提供强大的网页视频播放器。 - [HLS.js](https://github.com/video-dev/hls.js) — 实现 HLS 流媒体在浏览器中的播放支持。 diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx index a0f2e72..8523639 100644 --- a/src/app/login/page.tsx +++ b/src/app/login/page.tsx @@ -35,7 +35,7 @@ function VersionDisplay() { return ( + + + ); +} diff --git a/src/lib/version_check.ts b/src/lib/version_check.ts index 63f4386..f5c78ee 100644 --- a/src/lib/version_check.ts +++ b/src/lib/version_check.ts @@ -13,7 +13,7 @@ export enum UpdateStatus { // 远程版本检查URL配置 const VERSION_CHECK_URLS = [ - 'https://raw.githubusercontent.com/MoonTechLab/LunaTV/main/VERSION.txt', + 'https://raw.githubusercontent.com/mtvpls/MoonTVPlus/main/VERSION.txt', ]; /**