一、在线教育项目功能点(B2C)

1.后台管理系统

1.登录功能(SpringSecurity框架)

2.权限管理功能

(1)菜单管理

列表、添加、修改、删除

(2)角色管理

* 列表、添加、修改、删除、批量删除

* 为角色分配菜单

(2)用户管理

*列表、添加、修改、删除、批量删除

* 为用户分配角色

3.讲师管理功能

* 条件查询分页列表、添加、修改、删除

4.课程分类模块

(1)添加课程分类

* 读取Excel里面课程分类数据、添加到数据库当中

(2)课程分类列表

* 用树形结构显示课程分类列表

5.课程管理模块

(1)课程列表功能

(2)添加课程

* 课程发布流程:

第一步填写课程基本信息

第二步添加课程大纲(章节和小节)

第三步课程信息确认

最终课程发布

*** 课程如何判断是否已经被发布了?

使用 status ,刚开始未发布的时候status 状态为Draft,发布完以后 status的状态变为Normal

*** 课程添加过程中,中途把课程添加停止,重新去添加新的课程,如何找到之前没有发布完成课程,继续进行发布?

到课程列表中根据课程状态查询查询出未发布的课程,点击课程右边超链接把课程继续发布完成

(3) 添加小节的时候上传视频(使用了阿里云的视频点播功能)

6、统计分析模块

(1) 生成统计数据

(2) 统计数据图表显示

2.前台系统

1.首页数据显示

(1)显示幻灯片功能

(2)显示热门课程

(3) 显示名师

2.注册功能

(1) 获取手机的验证码(整合了阿里云的短息服务)

3.登录功能

(1)普通登录

* SSO(单点登录)

第一种: session广播机制实现实际上就是session的复制

第二种: 使用cookie+redis实现

1、在项目中任何一个模块进行登录,登录之后,把数据放到两个地方

(1)redis: 在key: 生成唯一随机值(ip、用户id等等) 在Value: 存放用户数据

(2) cookie: 把redis里面生成key值放到cookie里面

2、访问项目中其它模块,发送请求带着cookie进行发送,获取cookie值,拿着cookie做事情

把cookie获取值,到redis中进行查询,根据key进行查询,如果查询到数据就是登录

第三种: 使用token实现

1、在项目某个模块进行登录、登录之后,按照规则生成字符串,把登录之后用户包含到生成字符串里面,把字符串返回

(1) 可以把字符串通过cookie返回

(2) 把字符串通过地址栏返回

******* 使用JWT生成字符串

JWT生成字符串包含3个部分

(1) jwt头部信息

(2) 有效载荷包含主体信息(用户信息)

(3) 签名哈希防伪标志

*****登录流程******

登录调用登录接口返回token字符串,把返回token字符串放到cookie里面,创建前端拦截器进行拦截进行判断,如果cookie里面包含token字符串,把token字符串放到header里面,调用接口根据token获取用户信息,把用户信息放到cookie里面,进行显示。

(2) 微信扫码登录

OAuth2

是针特定问题解决方案

主要有两个问题:开放系统间授权,分布式访问

如何获取扫描人信息过程?

1.扫描之后,执行本地的callback方法,在callback获取两个值,在跳转时候传递过来

statc: 原样传递

code: 类似于手机验证码,随机唯一的值

2.拿着第一步获取到code值,请求微信提供固定的地址,获取到有两个值

(1)access_token: 访问凭证

(2) openid: 每个微信唯一标识

3.拿着上一步获取到两个值access_token和openid,再去请求一个微信提供固定地址,最终可以获取到微信扫描人信息。(微信昵称、微信头像)

4.名师列表功能

5.名师详情功能

6.课程列表功能

(1)条件查询分页列表功能

7.课程详情页

(1)课程信息显示(包含课程基本信息,分类,讲师,课程大纲)

(2)判断课程是否需要购买

8.课程视频在线播放

9.课程支付功能(微信支付)

(1)生成课程订单

(2)生成微信支付二维码

(3)微信最终支付

如果课程是收费课程,点击立即购买,生成课程订单

点击订单页面支付,生成微信支付二维码

使用微信扫描支付二维码实现支付

支付之后,每隔3秒查询支付状态(是否支付成功),如果没有支付成功等待,如果支付成功之后,更新订单状态(已经支付状态),向支付记录表添加支付成功记录。

二、在线教育项目技术点

使用了前后端分离开发

1.前端技术

(1)vue

基本语法

常见指令 v-bind v-model v-if v-for v-html

绑定事件 v-on-click @click

生命周期 created() 页面渲染之前 mounted() 页面渲染之后

ES6规范

(2)Element-ui

(3)node.js

是JavaScript运行环境,不需要浏览器直接运行js代码,模拟服务器效果

(4)npm

包管理工具,类似于Maven

npm命令: npm init npm install 依赖名称

(5) babel

转码器,把es6代码转换成es5代码

(6)前端模块化

通过一个页面或者一个js文件,调用另外一个js文件里面的方法

问题:es6的模块化代码无法在Node.js中执行,需要调用Babel编辑成es5后在执行

(7)后台系统使用 vue-admin-template

基于Vue+Element-ui

(8) 前台系统使用 Nuxt

基于Vue

服务端渲染技术

(9)Echarts

图表工具

2.后端技术

(1)项目采用微服务架构

(2)SpringBoot

SpringBoot 本质就是Spring,只是快速构建Spring 工程脚手架

细节:

启动类包扫描机制

设置扫描规则@ComponentScan("包路径")

SpringBoot配置文件

配置文件类型:properties和yml

配置文件加载顺序: bootstrap application application-dev

(3)SpringCloud

是很多框架的总称,使用这些框架实现微服务架构,基于SpringBoot实现

组成的框架有哪些

项目中使用阿里巴巴的Nacos,替代SpringCloud一些组件

使用Nacos作为注册中心

使用Nacos作为配置中心

使用Feign服务调用,一个微服务去调用另一个微服务,实现远程调用

熔断器

SpringCloud之前zuul网关，目前Gateway网关

(4)MyBatisPlus

MyBatisPlus就是对MyBatis做增强

自动填充

乐观锁

逻辑删除

代码生成器

(5)EasyExcel

阿里巴巴提供操作excel工具，代码简洁，效率很高

EasyExcel对poi进行封装，采用SAX方式解析

项目应用在添加课程分类，读取excel数据

(6)Spring Security

在项目整合框架实现权限管理功能

Spring Security框架组成:认证和授权

SpringSecurity登录认证过程

SpringSecurity代码执行过程

(7)Redis

首页数据通过Redis进行缓存

Redis数据类型

不太重要的或者是不经常改变的数据适合放在Redis作为缓存

(8)Nginx

反向代理服务器

请求转发、负载均衡、动静分离

(9)OAuth2+JWT

(10)HttpClient

发送请求返回响应的工具，不需要浏览器完成请求和响应的过程

应用场景：微信登录获取扫描人信息，微信支付查询支付状态

(11)Cookie

客户端技术

每次发送请求带着cookie值进行发送

cookie有默认会话级别，关闭浏览器cookie默认不存在了

但是可以设置cookie有效时长 setMaxAge

(12)微信登录

(13)微信支付

(14)阿里云OSS

文件存储服务器

添加讲师时候上传讲师头像

(15)阿里云视频点播

视频上传、删除、播放

整合阿里云视频播放器进行视频播放

* 使用视频播放凭证

(16)阿里云短信服务

注册时候，发送手机验证码

(17)Git

代码提交到远程Git仓库

(18)Docker+Jenkins

手动打包运行

idea打包

jenkins自动化部署过程

三、在线教育项目问题

1.多次路由跳转到同一个vue页面，页面中created方法只会执行一次

多次路由跳转到同一个vue页面，页面中created方法只会执行一次

解决方案：使用vue监听

2.前端问题-ES6模块化运行问题

Nodejs不能直接运行ES6模块化代码，需要使用Babel把ES6模块化代码转换ES5代码执行

3.mp生成19位id值

mp生成id值是19位，JavaScript处理数字类型值时候，只会处理到16位

4.跨域问题

访问协议，ip地址，端口号，这三个如果有任何一个不一样，产生跨域

跨域解决：

* 在Controller添加注解

* 通过网关解决

5.413问题

上传视频时候，因为Nginx有上传文件大小限制，如果超过Nginx大小，出现413

413错误：请求体过大

在Nginx配置客户端大小

响应状态码：413 403 302

6.Maven加载问题

maven加载项目时候，默认不会加载src-java文件夹里面xml类型文件的

直接复制xml文件到target目录

通过配置实现

(在线教育)项目总结相关推荐

黑马在线教育项目---5、使用填充器创建数据库数据
黑马在线教育项目---5.使用填充器创建数据库数据一.总结一句话总结: ①创建填充器文件:#php artisan make:seeder ManagerTableSeeder ③执行填充器文件: ...
黑马在线教育项目---15-16、datatables插件
黑马在线教育项目---15-16.datatables插件一.总结一句话总结: datatables插件也比较好用,引入好插件的js和css后,核心代码也就是插件的初始化,如果要修改配置可以百度 ...
在线教育项目02_前端知识（es6、vue）
在线教育项目02_讲师管理模块一.统一异常处理的另外两种情况 1.1 特殊异常(特定异常处理) 1.2 自定义异常处理二.统一日志处理 1.Logback日志工具三.ECMAScript 6.0 ...
在线教育项目_整体介绍
在线教育项目_整体介绍一.项目的背景二.商业模式 2.1 B2C(该项目的模式) 2.2 B2B2C(商家到商家到用户) 3.功能模块 3.1 系统后台 3.2 系统前台 4.项目使用到的技术 4 ...
在线教育项目04_讲师管理前端开发
在线教育项目04_讲师管理前端开发一.登录功能(临时) 跨域问题框架使用的过程二.前端讲师开发 1.讲师列表 2.讲师列表添加分页 3.讲师列表条件查询实现 4.讲师列表删除功能 5.讲师列表删 ...
SpringBoot在线教育项目（十一）
在线教育(十一) 一.服务端渲染技术NUXT-初始化NUXT 一.服务端渲染技术NUXT 二.NUXT环境初始化三.幻灯片插件二.首页静态效果整合和NUXT路由一.页面布局二.路由三.封装a ...
在线教育项目技术笔记2
文章目录一.对象存储OSS 1.阿里云OSS控制台使用 2.阿里云OSS开发准备 3.实现代码上传文件到阿里云OSS 二.nginx 1.nginx的启动安装 2.nginx配置项目请求转发三.e ...
Django——在线教育项目总结
项目简介在线教育平台软件依赖: WEB框架:Django(1.11.7).Django REST framework 前端框架:Vue(2.5.16) 数据库: MySql.redis 支付平台: ...
Java在线教育项目第一天项目介绍和工程搭建
第一章项目介绍和工程搭建学习目标熟悉移动端应用系统的架构设计熟悉大型软件系统设计中的各种图形结构熟悉数据库分库分表设计技巧熟悉Spring boot2.0+JavaConfig项目封装配置 ...

(在线教育)项目总结