# 在线播放视频系统 **Repository Path**: dantes/online-video-playback-system ## Basic Information - **Project Name**: 在线播放视频系统 - **Description**: 在线播放视频系统在线播放视频系统在线播放视频系统 - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 1 - **Created**: 2025-04-02 - **Last Updated**: 2025-04-02 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README \-------------------------------------version 15.0\------------------------------------- 需求分析、产品调研、设计、技术选型、买域名、买设备、开发、测试、部署、上线、修 Bug 59个接口 -------------------------------------已完成------------------------------------- 1.登录注册功能完善 2.视频分片上传。 3.视频播放MP4。 4.实现重复视频不用再次上传到服务器。 5.前后端部署到宝塔。 6.修改了后端登录注册参数校验规则。 7.登录注册功能完善，修改为邮箱登录（外加前端登录注册页面设计自适应布局） 8.购买服务器域名。 9.前端上传页面样式设计。 **遇到的问题：** 服务器上nginx刷新404问题： 关于为啥vue项目只配置index刷新会404： vue + nginx的配置， vue路由必须先加载 index.html 或者XX.js 才能识别到路由。 10.视频播放 11.首页video列表模块。 12.宝塔部署改为手动部署。 **20240724:** 前端首页骨架屏，并且实现无限滚动。 前端页面主题模式切换。（白天和夜晚，前端目前有一点样式小问题） **遇到的问题：** 部署nginx时报错404、403、500. **502 Bad Gateway nginx** 1.**上游服务器故障**：当 Nginx 作为代理服务器时，它将请求转发给上游服务器处理，并将上游服务器的响应返回给客户端。如果上游服务器出现故障、崩溃或无法访问，Nginx 将无法获取有效的响应，从而导致 "502 Bad Gateway" 错误。 2.连接超时：如果 Nginx 在与上游服务器建立连接时遇到超时问题，它将无法获取响应并返回 "502 Bad Gateway" 错误。这可能是由于上游服务器响应时间过长、网络连接问题或 Nginx 配置中的超时设置不足引起的。 3.错误的代理配置：Nginx 作为代理服务器时，需要正确配置代理规则和请求头信息，以便将请求正确转发给上游服务器。如果代理配置有误，Nginx 将无法与上游服务器进行有效通信，导致 "502 Bad Gateway" 错误。 4.DNS 解析问题：如果 Nginx 配置中使用了上游服务器的主机名，而 DNS 解析无法将主机名解析为正确的 IP 地址，那么 Nginx 将无法连接到上游服务器，从而导致 "502 Bad Gateway" 错误。 5.防火墙/安全组限制：如果防火墙或安全组配置限制了 Nginx 与上游服务器之间的通信，例如阻止了特定端口或协议的流量，那么 Nginx 将无法与上游服务器建立连接，从而导致 "502 Bad Gateway" 错误 **20240725：** 优化前端上传，更新后端上传代码。在分片时不计算md5值，这时无法判断用户是否上传重复视频。每次上传都上传真实资源。 优化视频播放，采用muiplayer插件播放，流式播放。 **20240728:** 前端实现个人主页、修改用户信息，我的关注，推荐视频页设计。部分页面骨架屏。 视频播放页：视频评论功能。 优化页面样式。 在全局异常处理器中实现打印接口信息，当异常出现时可以更快的定位到出现异常出现的地方。 **遇到的问题：** 发现后端的日志打印非常频繁，如果大量打印日志会造成系统性能下降。 用户点赞功能：使用synchronized保证同一个用户的点赞是串行执行的，保证幂等性。更新video表时可以不用加锁因为更新update默认是加行锁。 （写完代码一要更新） 前端视频收藏弹窗页面设计。 **20240729：** 视频收藏功能。设计收藏表和收藏夹表。 搜索功能。搜索历史记录在localhostStore里面，并且有搜索历史和热搜榜单。搜索页面采用分页展示。 **遇到的问题：** vue组件Infinite Scroll 无限滚动div必须要有overflow: auto；显示滚动条和高度，不然无法触发。 **202407029：** 优化页面，增加页面跳转，提高用户体验。 新增关注和取消关注功能。我的关注页面，我的粉丝页面。 404友好页面。 **20240731：** 查看订阅用户视频功能，优化页面，图片懒加载和加载失败时加载默认图片，手动实现数据无限加载。 查询视频评论数和播放量。删除评论功能。 使用redis实现视频播放量限制用户在12小时内观看同一个视频只算是一次播放量。 **20240801** 实现了用户搜索，和视频过滤搜索。 用户互关功能。 查看其他用户中心。 **20240803** 视频推荐。 数据库的表设计要严谨，谨慎。id如果使用自增，程序的扩展性就没有那么好。 实现用户自定义设置个人主页。可以选择是否展示信息，是否公开投稿、收藏、关注、粉丝列表。 实现收藏夹加入私有、公开功能。 新增用户邮箱搜索功能。 **20240804** 完善退出登录功能，清除redis中的token。 ``` deleteRecordById(item.id) ``` 继续优化前端上传。考虑到服务器上传带宽限制，浏览器并发请求数限制，优化调整Chunk大小和线程数。 **20240810** 新增历史记录和用户反馈功能。 使用 Redis 来暂存播放量，并定时批量同步到数据库，可以有效地减轻数据库的压力。 使用redis缓存前5页的热点视频，通过邮箱获取验证码方式校验用户登录。 -------------------------------------未完成------------------------------------- 分片文件md5校验和前端传递的md5对比，防止篡改（此功能暂定） 首页视频数据缓存到redis。 接口幂等性。 防止重复提交。 前端实现防抖节流。 修改密码。 刷新token。无感刷新。 添加视频标签。优化登录页面主题。 统计网站的访客了解用户行为、分析流量来源、优化网站内容等。（Matomo） 判断用户是否存在可以提取出来作为公共方法。在需要验证用户是否存在的接口前执行。 从redis中获取用户信息或判断是否存在。 白天黑夜主题BUG。