夜雨聆风学习资料网

ARTICLE · 1342918

项目源码|TikTube 仿 B 站弹幕视频网站|Spring Boot 4 + Vue 3

项目源码|TikTube 仿 B 站弹幕视频网站|Spring Boot 4 + Vue 3

课设、毕设想做「视频网站」方向,又不想从零写弹幕和审核?TikTube 是一个仿 B 站的开源视频站:投稿、截帧做封面、弹幕、评论、订阅、消息通知、创作者数据和后台审核都有。后端是 Spring Boot 4,前端是 Vue 3。唯一必装的外部服务是 MySQL,Redis 可以不装。本机已完整跑通:注册管理员、投稿 3 个自制样片、发弹幕和评论、后台审核,全部走了一遍。本帖 80 积分,下载区是完整前后端源码和中文部署说明。

4 步上手

  1. 装环境
    :JDK 25、Maven 3.9+、Node 20+、MySQL 8。JDK 必须是 25,低一版都编译不过。
  2. 建库导表
    :先 CREATE DATABASE tik_tube DEFAULT CHARSET utf8mb4;,再导入 tik_tube.sql。
  3. 起前后端
    :后端 java -jar 跑在 8080;前端 npm run dev 跑在 5173。
  4. 注册 admin 并投稿
    :第一个用户名叫 admin 的账号自动成为管理员。投稿、审核通过、发一条弹幕,看到它飘过去就算通过。
看这里:首页按分区展示稿件。三个都是我用 ffmpeg 自己生成的测试样片,卡片上能看到观看数、弹幕数和分区。

能做什么

  • 视频投稿
    :上传 MP4 / FLV / MKV,自动读出时长和分辨率
  • 截帧封面
    :在浏览器里拖动进度条,截当前画面当封面
  • 弹幕
    :滚动、顶部、底部三种模式,可选颜色
  • 互动
    :评论、楼中楼回复、点赞、收藏、订阅 UP 主
  • 消息通知
    :有人评论你的稿件,铃铛会亮
  • 创作者中心
    :播放、点赞、评论、收藏、涨粉的趋势图
  • 后台审核
    :稿件、评论、弹幕都可以先审后发
  • 还支持文章投稿、邀请码注册、TOTP 两步验证、S3 兼容对象存储、接大模型做 AI 自动审核。这几项支持但本篇未实测。

弹幕:观众在某个播放时间点发的短评论,会从画面上飘过去。

TOTP 两步验证:登录时除了密码,还要输入手机验证器 App 上 6 位会变的数字。

技术栈(压缩)

  • 后端:Spring Boot 4.1 + MyBatis-Plus,JDK 25
  • 视频处理:JavaCV(Java 调用 ffmpeg 的封装库)
  • 前端:Vue 3 + Vuetify 3 + Vite,播放器是 ArtPlayer
  • 数据库:MySQL 8;Redis 可选

本机部署(已跑通)

1. 数据库

本机用 Docker 跑了一个 MySQL 8。端口 3306 已有别的项目,所以换成了 3307。

CREATE DATABASE tik_tube DEFAULT CHARSET utf8mb4; mysql -uroot -p --default-character-set=utf8mb4 tik_tube < tik_tube.sql 

SQL 里没有建库语句,不先建库会直接报错。导入时要加 --default-character-set=utf8mb4,否则分区名会变成乱码。

2. 配置

改 TikTube/src/main/resources/application.yml 的三处:

  • 数据库地址改成 127.0.0.1,密码改成你自己的
  • tiktube.ip-db-path
     指向仓库自带的 ip2region_v4.xdb
  • open-redis
     保持 false

ip2region:一个离线 IP 库,用来把访问 IP 翻译成城市。路径不对,启动或访问时会报错。

下载区的源码包已经把这三处改成了 127.0.0.1、./ip2region_v4.xdb 和密码占位符,你只需填密码。

3. 后端

cd TikTube mvn clean package -Dmaven.test.skip=true -Djavacpp.platform=linux-x86_64 java -jar target/tiktube-1.4.0.jar 

-Djavacpp.platform 只打当前系统的本地库。不加的话,Maven 会把所有平台的 ffmpeg 都下下来,jar 会大得离谱。Windows 换成 windows-x86_64,M 系列 Mac 换成 macosx-arm64。

看这里:Java 版本是 25.0.5。出现绿色的 Started TikTubeApplication 就是后端起来了;最后一行是前端 5173 返回 200。

4. 前端

cd TikTubeWeb npm install npm run dev 

打开 http://127.0.0.1:5173。前端已把 /api 转发到 8080,不用另配跨域。

验收:投稿 → 审核 → 弹幕 → 数据

投稿和截帧封面

注册 admin 登录后,进「创作中心 → 投稿」。选视频后要点一下 Upload,它不会自动上传。传完点「从视频截取封面」,拖到想要的画面,点「截取当前帧」,再点「设为封面」。

看这里:视频卡片显示 15.0 秒、1280×720。封面区是从第 7 秒截下的画面。右侧检查清单还差分区和标签两项。

后台审核

默认开启内容审核。投稿后要到「管理中心 → 待审核」点通过,首页才看得到。

看这里:三个样片都在待审核列表里。右边铅笔按钮打开审核框,选「通过」再确认即可。

弹幕

弹幕和评论默认也要审核,在「弹幕管理」「评论管理」里点对勾通过。每个用户 10 秒只能发 1 条弹幕。

看这里:两个账号发的 6 条弹幕正从画面上方飘过。左上角是样片自带的计时器,当前在第 4 秒左右。

评论和回复

看这里:第二个测试账号「远影小灯」发了一条评论。下面的点赞数是 1、回复数是 1。
看这里:点回复图标会弹出楼中楼。这条是 admin 从消息页回过去的。

消息通知

看这里:右上角铃铛有红点。通知写明是哪个稿件收到了新评论,可以直接点「回复」。

订阅和个人主页

看这里:「远影小灯」关注了 admin。订阅页上方是关注的创作者,下方是他们的最新视频。
看这里:频道显示 1 位粉丝、3 个投稿,右侧是「已关注」。横幅是我自己上传的图。

创作者中心

看这里:累计播放 3、点赞 1、评论 2、收藏 1。待办里有 1 条未读消息,粉丝数是 1。
看这里:数据分析页可以切 7 / 30 / 90 天。顶部六个卡片里,弹幕统计是 8 条。

同步缓存

看这里:「管理中心 → 概览」里蓝色的「立即同步缓存」。关服务前先点它。

实测踩坑

  1. JDK 必须 25
    :pom 写死了 java.version=25,低于 25 编译不过。本机另装了 Temurin 25。
  2. 先建库再导表
    :SQL 里没有建库语句。导入记得加 utf8mb4 参数。
  3. IP 库路径要改
    :默认是作者自己电脑上的 Windows 路径。
  4. 选完视频要点 Upload
    :不点就一直卡在「还差:上传视频」。
  5. 三处审核都默认开着
    :稿件、评论、弹幕都要后台通过才对外显示。管理员自己发的评论也一样。不想审核,可在「网站设置」里关。
  6. 播放数涨得慢是正常的
    :同一 IP 对同一视频 6 小时只算 1 次,本机测试基本都是 1。
  7. 计数先放内存
    :播放、点赞、弹幕数默认 5 分钟才写进数据库。直接关服务会丢,要先点「立即同步缓存」。
  8. 重启后要重新登录
    :登录令牌的密钥每次启动随机生成。

安全与合规

  • 第一个注册 admin 的人就是管理员
    。部署到公网前,务必先自己注册 admin 占位。
  • 关服务前先在后台「同步缓存数据」,否则最近几分钟的计数会丢。
  • 测试请用自录或无版权的视频和封面,不要上传影视、番剧片段。本篇三个样片都是 ffmpeg 生成的。
  • 仓库自带的默认频道横幅和错误页动图来源不明。源码包里已换成中性占位图,正式上线也建议用自己的图。
  • 协议为 MIT:再分发请保留 LICENSE。
  • 源码包在本帖下载区:完整前后端源码 + 中文 DEPLOY.txt,已去掉 node_modules、target、.git,配置里没有任何真实密码。

装 JDK 25 → 建库导表 → 起前后端 → 注册 admin 投稿,一套带弹幕和审核的视频网站就跑起来了。

原文:https://yuanyinglight.com/2407.html

回首页,搜索你想要的文档

在首页搜索框输入关键词,快速定位资料

文库首页搜索指引 立即搜索

相关学习资料