一个基于 SpringBoot + Vue 复刻高仿B站的视频网站!
大家好,我是 Java陈序员。今天,给大家先容一个开源的视频网站,复刻高仿B站!
关注微信公众号:【Java陈序员】,获取开源项目分享、AI副业分享、超200本经典盘算机电子册本等。
项目先容
Teriteri —— 一个采用前后端分离的模式,参考 Bilibili PC 端,基于 SpringBoot + Vue3 实现的弹幕视频网站。
https://chen-coding.oss-cn-shenzhen.aliyuncs.com/create-center/Teriteri/img-20240727203920.png
现在实现的功能:
[*]首页视频随机推荐
[*]用户注册登录
[*]个人中心信息修改
[*]视频投稿
[*]视频审核
[*]内容搜刮(视频 + 用户)
[*]视频详情页(观看 + 点赞 + 收藏 + 弹幕 + 评论)
[*]消息系统(聊天等)
[*]个人空间(用户作品 + 收藏夹等)
暂停开辟的功能:
[*]视频分区
[*]用户动态
[*]观看历史
[*]热门排行
[*]数据统计
[*]推荐算法
技术栈:
[*]前端:Vue3 + Element-Plus
[*]后端:SpringBoot + MyBatis-Plus + JWT + Netty
[*]数据库:MySQL + Redis + ElasticSearch
项目截图
前台首页
https://chen-coding.oss-cn-shenzhen.aliyuncs.com/create-center/Teriteri/img-20240727204050.png
视频播放
https://chen-coding.oss-cn-shenzhen.aliyuncs.com/create-center/Teriteri/img-20240727204316.png
https://chen-coding.oss-cn-shenzhen.aliyuncs.com/create-center/Teriteri/img-20240727205306.png
视频搜刮
https://chen-coding.oss-cn-shenzhen.aliyuncs.com/create-center/Teriteri/img-20240727204842.png
视频投稿
https://chen-coding.oss-cn-shenzhen.aliyuncs.com/create-center/Teriteri/img-20240727205056.png
https://chen-coding.oss-cn-shenzhen.aliyuncs.com/create-center/Teriteri/img-20240727205017.png
https://chen-coding.oss-cn-shenzhen.aliyuncs.com/create-center/Teriteri/img-20240727204517.png
视频审核
https://chen-coding.oss-cn-shenzhen.aliyuncs.com/create-center/Teriteri/img-20240727204603.png
https://chen-coding.oss-cn-shenzhen.aliyuncs.com/create-center/Teriteri/img-20240727204619.png
视频审核是背景管理中的功能,背景管理现在只开辟了视频审核功能。
个人中心
https://chen-coding.oss-cn-shenzhen.aliyuncs.com/create-center/Teriteri/img-20240727204150.png
个人空间
https://chen-coding.oss-cn-shenzhen.aliyuncs.com/create-center/Teriteri/img-20240727204446.png
聊天对话
https://chen-coding.oss-cn-shenzhen.aliyuncs.com/create-center/Teriteri/img-20240727204717.png
快速上手
开辟环境:
[*]JDK 1.8
[*]ElasticSearch 7.17.16
[*]阿里云OSS
[*]NodeJs 16.16.0
服务端
1、克隆代码
git clone https://github.com/xunlu129/teriteri-backend.git2、创建数据库 teriteri
CREATE DATABASE `teriteri` DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_bin;3、在创建好的数据库中,执行 teriteri-backend/database/teriteri.sql 初始化数据库表
4、将项目以 Maven 的形式导入到 IDEA 中
5、将 resources 中的 application 文件加上后缀 .yml,并修改数据库、Redis、Oss、ElasticSearch 的配置信息
需要根据自己服务器信息填写好此中带 *** 号的配置信息,注意个人信息泄露风险!!!
6、执行主启动类 com.teriteri.backend.BackendApplication 启动项目
前台 Web 端
1、克隆代码
git clone https://github.com/xunlu129/teriteri-client.git2、安装依靠
npm install3、启动项目
npm run serve4、启动成功后浏览器访问 http://localhost:8787
背景管理 Web 端
1、克隆代码
git clone https://github.com/xunlu129/teriteri-admin.git2、安装依靠
npm install3、启动项目
npm run serve4、启动成功后浏览器访问 http://localhost:8788
5、管理员的账号密码需要在前台 Web 端进行注册,同时需要修改 user 表的 role 属性为 1 或者 2,该用户就是管理员了,如许就可以登录管理员端了。
Teriteri 作为一个视频网站,现在实现了大部分的功能,可以说完美复刻了B站,惋惜还有一些功能没开辟。但是瑕不掩瑜,仍是一个非常好的开源项目,部署也很简单,大家快去围观体验吧~
最后
推荐的开源项目已经收录到 GitHub 项目,欢迎 Star:
https://github.com/chenyl8848/great-open-source-project或者访问网站,进行在线浏览:
https://chencoding.top:8090/#/https://chen-coding.oss-cn-shenzhen.aliyuncs.com/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20240629100336.png
大家的点赞、收藏和评论都是对作者的支持,如文章对你有资助还请点赞转发支持下,谢谢!
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页:
[1]