代码拉取完成,页面将自动刷新
同步操作将从 贝尔摩德苦艾酒/Online-Education-Project 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
在线教育项目总结
一、项目简要描述
1.此项目名为“在线教育系统”,分为前台用户系统和后台管理系统。
2.采用了B2C模式。
3.同时采用前后端分离开发模式。
二、项目主要实现的功能点
1.后台管理系统:
(1)讲师管理模块:① 条件查询讲师(以分页列表显示)
② 添加讲师
③ 修改讲师
④ 删除讲师(逻辑删除)
(2)课程分类模块:① 添加课程分类(上传Excel文件,按行读取Excel中的数据,并添加到数据库中)
② 查询课程分类(使用树形结构展示课程分类列表)
(3)课程管理模块:① 条件查询课程(以分页列表显示)
② 添加课程(第一步填写课程基本信息;第二步添加课程大纲[章节、小节、视频];第三步课程最终发布)
判断课程是否已发布?(对应数据库course表中的status字段:Draft未发布、Normal已发布)
如何找到之前没有发布完成课程,继续进行发布?(点击课程列表页面右侧超链接即可继续完成发布)
添加课程大纲具体流程:先添加章节、在章节中添加小节、在小节中上传视频
③ 修改课程
④ 删除课程(课程中包含视频,需先删除相应的章节、小节、视频,再删除课程)
(4)统计分析模块:① 生成统计数据(根据统计日期生成某一天前台用户系统的注册人数、登录人数、每日播放视频数、每日新增课程数
生成之后的数据添加到数据库中)
② 统计数据图表显示(条件查询,数据以折线图展示)
2.前台用户系统:
(1)首页数据显示:① 显示幻灯片(对幻灯片id进行降序排列,查询前两条记录作展示,并将数据存入redis)
② 显示热门课程(对课程id进行降序排列,查询前八条记录作展示,并将数据存入redis)
③ 显示著名讲师(对讲师id进行降序排列,查询前四条记录作展示,并将数据存入redis)
(2)注册:输入用户昵称、手机号、密码、验证码完成注册(验证码存入redis,并设置过期时间。
key为手机号,value为随机四位数的验证码)
(3)登录:① 普通登录:SSO单点登录(常见三种方式:session广播机制实现、cookie+redis实现、token实现)
这里采用token方式实现:点击登录调用登录接口,采用jwt工具类生成token字符串,将token字符串放到cookie中,
创建前端拦截器进行判断,如果cookie中包含token字符串,将token字符串放到header中。
最后调用后端接口根据token获取用户信息,将用户信息放到cookie中,进行显示。
② 微信扫码登录:生成微信扫描二维码、获取扫码人信息、将用户信息添加到数据库
扫描之后微信接口返回code(临时票据),拿着code值采用HttpClient请求微信固定地址,
再得到两个值access_token(访问凭证)和openid(微信唯一标识),
再拿着这两个值请求采用HttpClient请求微信固定地址,最终得到扫码人相关信息。
(4)讲师列表、讲师详情:分页显示所有讲师,在讲师列表页面点击讲师名称或头像,跳转至当前讲师的详情页面。
(5)课程列表、课程详情:条件查询所有课程(分页显示),点击某个课程,进入课程详情页面。
(包含课程基本信息、课程分类、课程大纲、课程讲师等信息)
(6)课程章节中小节视频在线播放:点击课程大纲列表中的小节视频,即可跳转至播放页面。
(7)课程支付:采用微信扫码支付。
(微信支付流程:如果课程是收费的,需点击立即购买,生成课程支付订单,点击订单页面中“去支付”按钮,生成
微信支付二维码,使用微信扫描二维码完成支付。支付之后,每隔3秒查询一次支付状态:如果没有支付成功则继续
等待;如果支付成功,更新订单表中订单状态,同时将支付记录添加到支付记录表中,最后跳转回当前课程详情页面)
三、项目主要采用的技术点
1.后端:(1)SpringBoot(本质就是Spring,只是快速构建Spring项目的脚手架)
(2)SpringCloud(汇集多个框架技术,总体实现微服务架构)
① 服务注册中心——Nacos(所有核心微服务模块注册进Nacos)
② 服务配置中心——Nacos(将配置文件在Nacos中做统一管理)
③ 服务接口远程调用——Feign(一个微服务调用另一个微服务)
④ 服务降级/熔断——Hystrix(超时、异常、宕机触发服务降级)
⑤ 服务网关——GateWay(替代Nginx做请求转发、反向代理)
(3)MyBatis-Plus(自动填充、逻辑删除、代码生成器)
(4)Redis(将经常访问、不经常修改的数据存入Redis作为缓存)
(5)Nginx(作反向代理、请求转发)
(6)Git(将代码提交到远程仓库,做版本控制)
(7)EasyExcel(阿里巴巴提供的Java解析Excel工具,代码简洁、执行效率高)
(8)阿里云OSS(文件存储服务器,用在后台管理系统中讲师管理模块中讲师头像的上传)
(9)阿里云视频点播(视频上传、删除、整合阿里云视频播放器进行视频播放)
(10)微信扫码登录、微信扫码支付(采用OAuth2 + JWT + HttpClient + Cookie实现)
2.前端:(1)vue(基本语法、常见指令、绑定事件、生命周期)
(2)Element-ui
(3)ES6
(4)Node.js(JavaScript运行环境,不需要浏览器直接运行js代码,模拟服务器效果)
(5)NPM(包管理工具,类似于前端的Maven)
(6)Babel(转码器,可以把ES6代码转换成ES5代码)
(7)前端模块化(通过一个页面或者一个js文件,调用另外一个js文件里面的方法
问题:ES6的模块化无法在Node.js中执行,需要用Babel编辑成ES5后再执行)
(8)ECharts(用在后台管理系统中统计分析模块中将数据做图表显示)
(9)后台管理系统使用vue-admin-template(基于vue + Element-ui)
(10)前台用户系统使用Nuxt(基于vue + 服务器渲染技术)
四、项目开发过程中遇到的问题
1.前端路由切换问题:(1)多次路由跳转到同一个vue页面,页面中created方法只会执行一次
(2)解决方案:使用vue中的watch监听
2.前端ES6模块化运行问题:(1)Nodejs不能直接运行ES6模块化代码
(2)解决方案:需要使用Babel把ES6模块化代码转换ES5代码,再执行
3.mp生成19位id值:(1)mp生成id值是19位,JavaScript处理数字类型值时候,只会处理到16位
(2)解决方案:将生成实体类的id字段的类型改为String,对应主键生成策略ID_WORKER_STR
4.跨域问题:(1)访问协议,ip地址,端口号,这三个如果有任何一个不一样,产生跨域
(2)解决方案:①在Controller添加@CrossOrigin注解
②通过SpringCloud-GateWay网关解决
5.413状态码问题:(1)上传视频时候,因为Nginx有上传文件大小限制,如果超过Nginx的限制大小,会出现413
(2)解决方案:在nginx.conf配置文件中修改上传文件的大小:client_max_body_size 1024M;
6.Maven加载问题:(1)maven加载项目时候,默认不会加载src/main/java目录下的xml类型文件
(2)解决方案:在pom文件中进行配置即可
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。