# videotube

**Repository Path**: robot1937/videotube

## Basic Information

- **Project Name**: videotube
- **Description**: VideoTube 🎬 — Vue3 + Spring Boot 3，YouTube 风格中长视频平台，支持上传/转码/播放/评论/订阅/推荐/搜索
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-06-13
- **Last Updated**: 2026-06-15

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# VideoTube 🎬

> YouTube 风格的中长视频内容平台 —— Vue 3 + Spring Boot 3 全栈实现，支持上传 / 转码 / 播放 / 评论 / 订阅 / 推荐 / 搜索。

[![Vue](https://img.shields.io/badge/Vue-3-42b883?logo=vue.js)](https://vuejs.org/)
[![TypeScript](https://img.shields.io/badge/TypeScript-5-3178c6?logo=typescript&logoColor=white)](https://www.typescriptlang.org/)
[![Spring Boot](https://img.shields.io/badge/Spring%20Boot-3-6db33f?logo=springboot&logoColor=white)](https://spring.io/projects/spring-boot)
[![MySQL](https://img.shields.io/badge/MySQL-8-4479a1?logo=mysql&logoColor=white)](https://www.mysql.com/)
[![License](https://img.shields.io/badge/license-MIT-blue.svg)](#)

---

## 📖 项目背景

YouTube 在中国不可访问，B 站偏向二次元 / 短中视频，抖音偏向竖屏短视频，**中长横屏视频内容创作者** 在国内缺乏一个聚焦的中立平台。VideoTube 借鉴 YouTube 的产品形态，定位国内 / 海外华人区的中长视频聚合站。

定位：**MVP 4 周开发，目标用户 = 创作者 + 中长视频观众**。

## ✨ 核心功能

| 模块 | 说明 |
|---|---|
| 🎥 **视频上传 / 转码** | 本地 ffmpeg 转 HLS（M3U8 + TS 片段），未来可切 Cloudflare Stream |
| ▶️ **HLS 播放** | hls.js 自适应码率，支持手机 / PC |
| 💬 **评论系统** | 多级嵌套回复 + 点赞 |
| 🔔 **订阅 / 频道** | 关注创作者，订阅源时间线 |
| 👍 **互动** | 点赞 / 点踩 / 收藏 / 历史记录 |
| 🔍 **搜索** | 标题 / 标签 / 创作者全文检索 |
| 🎯 **推荐** | 协同过滤 + 标签匹配混合算法 |
| 📊 **创作者后台** | 视频管理 / 数据看板 / 收益统计 |

## 🛠 技术栈

**前端**：
- Vue 3 + TypeScript + Vite
- Pinia 状态管理
- Vue Router 4
- Axios + 拦截器统一鉴权
- hls.js 视频播放

**后端**：
- Spring Boot 3.x（JDK 17）
- MyBatis-Plus 数据访问
- MySQL 8 + Redis 7
- JWT 鉴权（HS256）
- ffmpeg 命令行转码

**架构**：
```
┌──────────┐   HTTP   ┌─────────────┐   JDBC   ┌─────────┐
│  Vite    │ ────────→│ Spring Boot │ ────────→│  MySQL  │
│  :5173   │          │   :8090     │          │  :3306  │
└──────────┘          └──────┬──────┘          └─────────┘
                             │
                             ↓
                      ┌─────────────┐
                      │ ffmpeg HLS  │
                      │  storage/   │
                      └─────────────┘
```

## 🚀 快速开始

### 0. 环境准备
- JDK 17+
- Node.js 20+
- MySQL 8（建库 `videotube`）
- Redis 7
- ffmpeg（系统 PATH 可调用）

### 1. 配置后端

```bash
cd videotube-server
cp src/main/resources/application.yml.example src/main/resources/application-local.yml
# 编辑 application-local.yml，填入：
#   spring.datasource.password: 你的 MySQL 密码
#   videotube.jwt.secret: 一个 32+ 字符的随机串
```

或通过环境变量注入（推荐）：
```bash
export MYSQL_PASSWORD=your_password
export VT_JWT_SECRET=your_random_256bit_secret
export VT_UPLOAD_DIR=/path/to/video/storage
```

### 2. 初始化数据库

```bash
mysql -u root -p videotube < videotube-server/src/main/resources/schema.sql
```

### 3. 启动后端

```bash
cd videotube-server
mvn spring-boot:run
# 监听 :8090，contextPath = /api
```

### 4. 启动前端

```bash
cd videotube-client
npm install
npm run dev
# 访问 http://localhost:5173
```

### 5. 测试账号
注册一个账号，或使用：
- 手机号：`13834485913`
- 密码：`test123456`

## 📂 目录结构

```
videotube/
├── videotube-client/             # Vue 3 前端
│   ├── src/
│   │   ├── api/                  # axios 封装
│   │   ├── pages/                # 页面级组件
│   │   ├── components/           # 通用组件
│   │   ├── stores/               # Pinia
│   │   ├── router/
│   │   └── App.vue
│   ├── vite.config.ts
│   └── package.json
├── videotube-server/             # Spring Boot 后端
│   ├── src/main/java/com/videotube/
│   │   ├── controller/
│   │   ├── service/
│   │   ├── mapper/
│   │   ├── entity/
│   │   ├── dto/
│   │   ├── config/
│   │   ├── filter/               # JWT 过滤器
│   │   └── exception/            # 全局异常
│   ├── src/main/resources/
│   │   ├── application.yml       # 主配置（脱敏版）
│   │   └── mapper/               # MyBatis xml
│   └── pom.xml
└── docs/                         # 产品文档（PRD / 接口）
```

## 🔐 安全说明

- ❌ **不要** 把真实的 `application-local.yml` / `.env` 提交到仓库（已在 `.gitignore` 中）
- ✅ JWT secret 必须 ≥ 256 位随机字符串
- ✅ MySQL 密码 + Redis 密码通过环境变量注入
- ✅ 上传文件大小限制 500MB，时长限制 10 分钟（可配置）
- ✅ 视频文件不入库，存到 `storage/` 目录

## 📜 License

MIT