springboot+mybatis-plus+vue+element+vant2实现短视频网站，模拟西瓜视频移动端

项目包含管理后台、移动端以及后端实现，即是两个前端项目加后端实现，数据库采用mysql5.8，使用redis缓存，spring oauth2、security、token登录等。管理后台前端采用vue+element实现，移动端使用vue+vant2实现。后端使用java springboot实现。

以下是项目在线访问预览地址：

管理后台：点击访问

移动端：点击访问

element官网：点击访问

vant2官网：点击访问

二、管理后台

1.登录

2.登录成功，进入欢迎页

3.视频分类管理

4. 视频标签管理

5.视频管理

6.评论管理

7.用户管理

8.字典管理（类似于后端的枚举）

9.参数管理（富文本录入）

10.管理员管理

三、移动端

1.首页

2.视频详情

3.视频评论

4.我的

5.编辑资料

6.我的关注

7.我的粉丝

8.我的视频

9.登录、注册

四、关键代码实现

1.后端项目结构图，idea开发工具

2.数据库表脚本设计实现

-- 系统管理员
CREATE TABLE `admin` (
  `id` bigint NOT NULL COMMENT '主键',
  `username` varchar(60) NOT NULL COMMENT '用户名',
  `password` varchar(100) NOT NULL COMMENT '登录密码',
  `real_name` varchar(32) DEFAULT NULL COMMENT '姓名',
  `gender` tinyint(1) DEFAULT 0 COMMENT '用户性别 0保密 1男 2女',
  `avatar` varchar(300) DEFAULT NULL COMMENT '头像',
  `phone` varchar(20) DEFAULT NULL COMMENT '手机',
  `email` varchar(60) DEFAULT NULL COMMENT '邮箱',
  `remark` varchar(200) DEFAULT NULL COMMENT '备注',
  `status` tinyint(1) DEFAULT 0 COMMENT '是否禁用 0否  1是',
  `deleted` tinyint(1) DEFAULT 0 COMMENT '逻辑删除标记 是否已删除: 0否  1是',
  `create_system_time` datetime DEFAULT NULL COMMENT '创建时间',
  `create_system_admin_id` bigint DEFAULT NULL COMMENT '创建人ID',
  `update_system_time` datetime DEFAULT NULL COMMENT '更新时间',
  `update_system_admin_id` bigint DEFAULT NULL COMMENT '修改人ID',
  `admin_type` tinyint(1) DEFAULT '1' COMMENT '管理员类型 0超级管理员  1普通管理员',
  PRIMARY KEY (`id`) USING BTREE,
  UNIQUE KEY `admin_key_username` (`username`) USING BTREE
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='系统管理员';

-- 2022-10-19 用户信息
CREATE TABLE `user_info`
(
    `id` bigint NOT NULL COMMENT '主键',
    `nickname` varchar(10) NOT NULL COMMENT '用户名称',
    `phone` varchar(20) NOT NULL COMMENT '手机号',
    `password` varchar(255) NOT NULL COMMENT '登录密码 加密',
    `avatar` varchar(225) DEFAULT NULL COMMENT '头像',
    `gender`  TINYINT(1) DEFAULT 0 COMMENT '性别 0保密 1男 2女',
    `signature` varchar(225) DEFAULT NULL COMMENT '个性签名',
    `remark` varchar(225) DEFAULT NULL COMMENT '备注',
    `status`  TINYINT(1) DEFAULT 0 COMMENT '是否禁用 0否 1是',
    `deleted` tinyint(1) DEFAULT '0' COMMENT '逻辑删除标记 是否已删除: 0否  1是',
    `create_time` datetime(0) COMMENT '创建时间',
    `update_time` datetime(0) COMMENT '更新时间',
    `update_system_time` datetime DEFAULT NULL COMMENT '更新时间-管理员',
    `update_system_admin_id` bigint DEFAULT NULL COMMENT '修改人ID-管理员',
    PRIMARY KEY (`id`) USING BTREE,
    UNIQUE KEY `phone` (`phone`) USING BTREE
) ENGINE = InnoDB
  DEFAULT CHARSET = utf8mb4 COMMENT ='用户信息';

-- 视频分类
CREATE TABLE `video_type` (
  `id` bigint NOT NULL COMMENT '主键',
  `type_name` varchar(255) NOT NULL COMMENT '分类名称',
  `sort` int NOT NULL DEFAULT 0 COMMENT '排序，越小越靠前',
  `remark` varchar(255) DEFAULT NULL COMMENT '备注',
  `status` tinyint(1) DEFAULT 0 COMMENT '是否禁用 0否  1是',
  `deleted` tinyint(1) DEFAULT 0 COMMENT '逻辑删除标记 是否已删除: 0否  1是',
  `create_system_time` datetime DEFAULT NULL COMMENT '创建时间',
  `create_system_admin_id` bigint DEFAULT NULL COMMENT '创建人ID',
  `update_system_time` datetime DEFAULT NULL COMMENT '更新时间',
  `update_system_admin_id` bigint DEFAULT NULL COMMENT '修改人ID',
  PRIMARY KEY (`id`) USING BTREE
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='视频分类';

-- 商品所属分类
CREATE TABLE `video_type_item` (
  `id` bigint NOT NULL COMMENT '主键',
  `video_id` bigint NOT NULL DEFAULT 0 COMMENT '视频主键',
  `video_type_id` bigint NOT NULL DEFAULT 0 COMMENT '分类主键',
  `deleted` tinyint(1) DEFAULT '0' COMMENT '逻辑删除标记 是否已删除: 0否  1是',
  `create_time` datetime NOT NULL COMMENT '创建时间',
  `update_time` datetime NOT NULL COMMENT '修改时间',
  PRIMARY KEY (`id`) USING BTREE
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='商品所属分类';

-- 视频标签
CREATE TABLE `video_label` (
  `id` bigint NOT NULL COMMENT '主键',
  `label_name` varchar(255) NOT NULL COMMENT '分类名称',
  `sort` int NOT NULL DEFAULT 0 COMMENT '排序，越小越靠前',
  `remark` varchar(255) DEFAULT NULL COMMENT '备注',
  `status` tinyint(1) DEFAULT 0 COMMENT '是否禁用 0否  1是',
  `deleted` tinyint(1) DEFAULT 0 COMMENT '逻辑删除标记 是否已删除: 0否  1是',
  `create_system_time` datetime DEFAULT NULL COMMENT '创建时间',
  `create_system_admin_id` bigint DEFAULT NULL COMMENT '创建人ID',
  `update_system_time` datetime DEFAULT NULL COMMENT '更新时间',
  `update_system_admin_id` bigint DEFAULT NULL COMMENT '修改人ID',
  PRIMARY KEY (`id`) USING BTREE
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='视频标签';

-- 商品所属标签
CREATE TABLE `video_label_item` (
  `id` bigint NOT NULL COMMENT '主键',
  `video_id` bigint NOT NULL DEFAULT 0 COMMENT '视频主键',
  `video_label_id` bigint NOT NULL DEFAULT 0 COMMENT '标签主键',
  `deleted` tinyint(1) DEFAULT '0' COMMENT '逻辑删除标记 是否已删除: 0否  1是',
  `create_time` datetime NOT NULL COMMENT '创建时间',
  `update_time` datetime NOT NULL COMMENT '修改时间',
  PRIMARY KEY (`id`) USING BTREE
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='商品所属标签';

-- 视频
  CREATE TABLE `video`
(
    `id` bigint NOT NULL COMMENT '主键',
    `user_id` bigint NOT NULL COMMENT '所属用户主键',
    `video_name` varchar(500) NOT NULL COMMENT '视频名称',
    `video_des` varchar(1000) DEFAULT NULL COMMENT '视频简介',
    `cover_path` varchar(500) DEFAULT NULL COMMENT '封面图片',
    `upload_type` tinyint(1) DEFAULT 1 COMMENT '上传类型 1文件上传 2录入路径',
    `video_path` varchar(2000) DEFAULT NULL COMMENT '视频路径',
    `browse_num` int NOT NULL DEFAULT 0 COMMENT '观看数量',
    `status` tinyint(1) DEFAULT 0 COMMENT '是否上架 0否  1是',
    `deleted` tinyint(1) DEFAULT 0 COMMENT '逻辑删除标记 是否已删除: 0否  1是',
    `create_system_time` datetime DEFAULT NULL COMMENT '创建时间',
    `create_system_admin_id` bigint DEFAULT NULL COMMENT '创建人ID',
    `update_system_time` datetime DEFAULT NULL COMMENT '更新时间',
    `update_system_admin_id` bigint DEFAULT NULL COMMENT '修改人ID',
    PRIMARY KEY (`id`) USING BTREE
) ENGINE = InnoDB
  DEFAULT CHARSET = utf8mb4 COMMENT ='视频';

-- 系统字典
CREATE TABLE `system_dict` (
  `id` bigint NOT NULL COMMENT '主键',
  `parent_id` bigint NOT NULL DEFAULT '0' COMMENT '父主键',
  `code` varchar(255) NOT NULL COMMENT '字典编码',
  `dict_key` int DEFAULT NULL COMMENT '字典值',
  `dict_name` varchar(255) NOT NULL COMMENT '字典名称',
  `sort` int NOT NULL DEFAULT 0 COMMENT '排序，越小越靠前',
  `remark` varchar(255) DEFAULT NULL COMMENT '字典备注',
  `status` tinyint(1) DEFAULT 0 COMMENT '是否禁用 0否  1是',
  `deleted` tinyint(1) DEFAULT 0 COMMENT '逻辑删除标记 是否已删除: 0否  1是',
  `create_system_time` datetime DEFAULT NULL COMMENT '创建时间',
  `create_system_admin_id` bigint DEFAULT NULL COMMENT '创建人ID',
  `update_system_time` datetime DEFAULT NULL COMMENT '更新时间',
  `update_system_admin_id` bigint DEFAULT NULL COMMENT '修改人ID',
  PRIMARY KEY (`id`) USING BTREE
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='系统字典';

-- 系统参数
CREATE TABLE `system_param` (
  `id` bigint NOT NULL COMMENT '主键',
  `code` varchar(255) NOT NULL COMMENT '参数编码，唯一',
  `title` varchar(255) NOT NULL COMMENT '标题',
  `content` longtext NOT NULL COMMENT '内容',
  `sort` int NOT NULL DEFAULT 0 COMMENT '排序，越小越靠前',
  `remark` varchar(255) DEFAULT NULL COMMENT '备注',
  `status` tinyint(1) DEFAULT 0 COMMENT '是否禁用 0否  1是',
  `deleted` tinyint(1) DEFAULT 0 COMMENT '逻辑删除标记 是否已删除: 0否  1是',
  `create_system_time` datetime DEFAULT NULL COMMENT '创建时间',
  `create_system_admin_id` bigint DEFAULT NULL COMMENT '创建人ID',
  `update_system_time` datetime DEFAULT NULL COMMENT '更新时间',
  `update_system_admin_id` bigint DEFAULT NULL COMMENT '修改人ID',
  PRIMARY KEY (`id`) USING BTREE
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='系统参数';

-- 视频评论
  CREATE TABLE `video_comment`
(
    `id` bigint NOT NULL COMMENT '主键',
    `user_id` bigint NOT NULL COMMENT '用户主键',
    `video_id` bigint NOT NULL COMMENT '视频主键',
    `content` varchar(1000) DEFAULT NULL COMMENT '评论内容',
    `like_num` int NOT NULL DEFAULT 0 COMMENT '点赞数量',
    `status`  TINYINT(1) NOT NULL DEFAULT 0 COMMENT '是否禁用 0否 1是',
    `deleted` tinyint(1) DEFAULT 0 COMMENT '逻辑删除标记 是否已删除: 0否  1是',
    `create_time` datetime(0) COMMENT '创建时间',
    `update_time` datetime(0) COMMENT '更新时间',
    `update_system_time` datetime DEFAULT NULL COMMENT '更新时间-管理员',
    `update_system_admin_id` bigint DEFAULT NULL COMMENT '修改人ID-管理员',
    PRIMARY KEY (`id`) USING BTREE
) ENGINE = InnoDB
  DEFAULT CHARSET = utf8mb4 COMMENT ='视频评论';

-- 视频评论点赞
  CREATE TABLE `video_comment_like`
(
    `id` bigint NOT NULL COMMENT '主键',
    `user_id` bigint NOT NULL COMMENT '用户主键',
    `comment_id` bigint NOT NULL COMMENT '评论主键',
    `deleted` tinyint(1) DEFAULT 0 COMMENT '逻辑删除标记 是否已删除: 0否  1是',
    `create_time` datetime(0) COMMENT '创建时间',
    `update_time` datetime(0) COMMENT '更新时间',
    PRIMARY KEY (`id`) USING BTREE,
    UNIQUE KEY `user_id_comment_id` (`user_id`,`comment_id`) USING BTREE
) ENGINE = InnoDB
  DEFAULT CHARSET = utf8mb4 COMMENT ='视频评论点赞';

-- 用户关注记录
CREATE TABLE `user_follow` (
  `id` bigint NOT NULL COMMENT '主键',
  `user_id` bigint NOT NULL COMMENT '登录用户主键',
  `be_followed_user_id` bigint NOT NULL COMMENT '被关注用户id',
  `deleted` tinyint(1) DEFAULT '0' COMMENT '逻辑删除标记 是否已删除: 0否  1是',
  `create_time` datetime NOT NULL COMMENT '创建时间',
  `update_time` datetime NOT NULL COMMENT '修改时间',
  PRIMARY KEY (`id`) USING BTREE,
  UNIQUE KEY `user_id_be_followed_user_id` (`user_id`,`be_followed_user_id`) USING BTREE
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='用户关注记录';

3.视频controller层

package com.product.controller;

import com.product.entity.base.PageQuery;
import com.product.entity.base.Result;
import com.product.entity.base.ResultPage;
import com.product.entity.req.VideoReq;
import com.product.entity.vo.VideoVO;
import com.product.service.VideoService;
import com.product.util.CommonUtil;
import com.product.util.JwtUtil;
import io.swagger.annotations.Api;
import io.swagger.annotations.ApiImplicitParam;
import io.swagger.annotations.ApiImplicitParams;
import io.swagger.annotations.ApiOperation;
import lombok.extern.slf4j.Slf4j;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.multipart.MultipartFile;

import javax.annotation.Resource;
import java.util.List;

/**
 * @author hjf
 * @date 2023-03-21 10:26
 * @describe 视频管理controller
 */
@Api(tags = "视频管理")
@Slf4j
@RestController
@RequestMapping("/video")
public class VideoController {

    @Resource
    private VideoService videoService;

    @PostMapping("/add")
    @ApiOperation(value = "添加", notes = "添加")
    @ApiImplicitParams({
            @ApiImplicitParam(name = "id", value = "ID", required = false, dataType = "Long", paramType = "query"),
            @ApiImplicitParam(name = "videoName", value = "视频名称", required = true, dataType = "String", paramType = "query"),
            @ApiImplicitParam(name = "userId", value = "发布用户", required = true, dataType = "Long", paramType = "query"),
            @ApiImplicitParam(name = "videoTypeIdList", value = "分类", required = true, dataType = "List<Long>", paramType = "query"),
            @ApiImplicitParam(name = "videoLabelIdList", value = "标签", required = true, dataType = "List<Long>", paramType = "query"),
            @ApiImplicitParam(name = "videoDes", value = "视频描述", required = false, dataType = "String", paramType = "query"),
            @ApiImplicitParam(name = "uploadType", value = "上传类型", required = true, dataType = "Integer", paramType = "query"),
            @ApiImplicitParam(name = "videoPath", value = "视频路径", required = false, dataType = "String", paramType = "query"),
            @ApiImplicitParam(name = "status", value = "状态", required = true, dataType = "Integer", paramType = "query"),
            @ApiImplicitParam(name = "coverFile", value = "封面图片", required = false, dataType = "MultipartFile", paramType = "query"),
            @ApiImplicitParam(name = "videoFile", value = "视频文件", required = false, dataType = "MultipartFile", paramType = "query")
    })
    public Result<?> add(
            @RequestParam(value = "id",required = false)  Long id,
            @RequestParam("videoName")  String videoName,
            @RequestParam("userId")  Long userId,
            @RequestParam("videoTypeIdList")  List<Long> videoTypeIdList,
            @RequestParam("videoLabelIdList")  List<Long> videoLabelIdList,
            @RequestParam(value = "videoDes",required = false) String videoDes,
            @RequestParam("uploadType") Integer uploadType,
            @RequestParam(value = "videoPath",required = false)  String videoPath,
            @RequestParam("status")  Integer status,
            @RequestParam(value = "coverFile",required = false) MultipartFile coverFile,
            @RequestParam(value = "videoFile",required = false) MultipartFile videoFile
    ) {
        VideoReq videoReq = new VideoReq();
        videoReq.setId(id);
        videoReq.setVideoName(videoName);
        videoReq.setUserId(userId);
        videoReq.setVideoTypeIdList(videoTypeIdList);
        videoReq.setVideoLabelIdList(videoLabelIdList);
        videoReq.setVideoDes(videoDes);
        videoReq.setUploadType(uploadType);
        videoReq.setVideoPath(videoPath);
        videoReq.setStatus(status);
        videoReq.setCoverFile(coverFile);
        videoReq.setVideoFile(videoFile);
        return videoService.add(JwtUtil.getUserId(),videoReq);
    }

    @ApiOperation("分页")
    @PostMapping("/getPage")
    public ResultPage<VideoVO> getPage(@RequestBody PageQuery pageQuery) {
        return videoService.getPage(JwtUtil.getUserId(),pageQuery);
    }

    @ApiOperation("详情")
    @GetMapping("/getDetailById")
    public Result<VideoVO> getDetail(@RequestParam("id") Long id) {
        return videoService.getDetailById(id);
    }

    @ApiOperation("更新状态")
    @PostMapping("/updateStatus")
    public Result<?> updateStatus(@RequestParam("ids") String ids, @RequestParam("status") Integer status) {
        List<Long> idList = CommonUtil.stringToLongList(ids);
        return videoService.updateStatus(JwtUtil.getUserId(),idList,status);
    }

    @ApiOperation("删除")
    @PostMapping("/del")
    public Result<?> del(@RequestParam("ids") String ids) {
        List<Long> idList = CommonUtil.stringToLongList(ids);
        return videoService.del(JwtUtil.getUserId(),idList);
    }

    @ApiOperation("更新浏览数")
    @PostMapping("/updateBrowseNum")
    public Result<?> updateBrowseNum(@RequestParam("videoId") Long videoId) {
        return videoService.updateBrowseNum(JwtUtil.getUserId(),videoId);
    }

    @ApiOperation("分页")
    @GetMapping("/getPageByVideoTypeId")
    @ApiImplicitParams({
            @ApiImplicitParam(name = "videoTypeId", value = "视频分类ID", required = false, dataType = "Long", paramType = "query"),
            @ApiImplicitParam(name = "currentPage", value = "当前页", required = true, dataType = "Integer", paramType = "query"),
            @ApiImplicitParam(name = "pageSize", value = "当前页", required = false, dataType = "Integer", paramType = "query")
    })
    public ResultPage<VideoVO> getPageByVideoTypeId(
            @RequestParam(value = "videoTypeId",required = false) Long videoTypeId,
            @RequestParam("currentPage")  Integer currentPage,
            @RequestParam(value = "pageSize",required = false,defaultValue = "10")  Integer pageSize
    ) {
        return videoService.getPageByVideoTypeId(JwtUtil.getUserId(),videoTypeId,currentPage,pageSize);
    }

    @ApiOperation("视频详情-推荐列表")
    @GetMapping("/getRecommendListForDetail")
    @ApiImplicitParam(name = "videoId", value = "视频详情ID", required = true, dataType = "Long", paramType = "query")
    public Result<List<VideoVO>> getRecommendListForDetail(@RequestParam(value = "videoId") Long videoId) {
        return videoService.getRecommendListForDetail(JwtUtil.getUserId(),videoId,false);
    }

    @ApiOperation("获取用户发布视频数量")
    @GetMapping("/getVideoNumByUserId")
    public Result<Integer> getVideoNumByUserId(@RequestParam("userId") Long userId) {
        return videoService.getVideoNumByUserId(userId);
    }

    @ApiOperation("分页-根据用户")
    @GetMapping("/getPageByUserId")
    @ApiImplicitParams({
            @ApiImplicitParam(name = "currentPage", value = "当前页", required = true, dataType = "Integer", paramType = "query"),
            @ApiImplicitParam(name = "pageSize", value = "当前页", required = false, dataType = "Integer", paramType = "query")
    })
    public ResultPage<VideoVO> getPageByUserId(
            @RequestParam("currentPage")  Integer currentPage,
            @RequestParam(value = "pageSize",required = false,defaultValue = "10")  Integer pageSize
    ) {
        return videoService.getPageByUserId(JwtUtil.getUserId(),currentPage,pageSize);
    }
}

4.后端开发文档访问

访问地址格式：后端项目地址+后端项目端口号+/doc.html

如：http://localhost:9002/doc.html

5.项目端口号配置

6.移动端项目截图

7.管理后台前端项目截图

五、总结

项目功能完整，后续可能将不断升级。

关注作者，及时了解更多好项目！

作者主页也有更多好项目分享！

获取源码或如需帮助，可通过博客后面名片+作者即可！

其他作品集合