谷粒学院——Day20【项目总结】

本文涉及的产品
云数据库 Redis 版,社区版 2GB
推荐场景:
搭建游戏排行榜
简介: 谷粒学院——Day20【项目总结】
❤ 作者主页:欢迎来到我的技术博客😎
❀ 个人介绍:大家好,本人热衷于Java后端开发,欢迎来交流学习哦!( ̄▽ ̄)~*
🍊 如果文章对您有帮助,记得关注、点赞、收藏、评论⭐️⭐️⭐️
📣 您的支持将是我创作的动力,让我们一起加油进步吧!!!🎉🎉

总结在线教育项目功能点

一、准备

  1. 把后端接口启动起来
  2. 启动前端项目(前台系统和后台系统)

二、项目后台管理系统功能

1. 登录功能(SpringSecurity框架)


2. 权限管理模块

  1. 菜单管理

    • 列表、添加、修改、删除
  2. 角色管理

    • 列表、添加、修改、删除、批量删除
    • 为角色分配菜单
  3. 用户管理

    • 列表、添加、修改、删除、批量删除
    • 为用户分配角色
  4. 权限管理表和关系

    • 使用五张表【用户表、角色表、菜单表、用户角色中间表、角色菜单中间表】

3. 讲师管理模块

  • 条件查询分页列表
  • 添加讲师
  • 修改讲师
  • 删除讲师

4. 课程分类模块

  1. 添加课程分类

    • 读取Excel里面课程分类数据,添加到数据库中
  2. 课程分类列表、、

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

5. 课程管理模块

  1. 课程列表功能
  2. 添加课程

    • 课程发布流程:第一步填写课程基本信息,第二步添加课程大纲(章节和小节),第三步课程信息确认,最终课程发布。
    • 课程如何判断是否已经被发布了?使用status字段。
    • 课程添加过程中,中途把课程停止添加,重新去添加新的课程,如何找到之前没有发布完成课程,继续进行发布? 到课程列表中根据课程状态查询未发布的课程,点击课程右边超链接把课程继续发布完成。
  3. 添加小节上传课程视频

6. 统计分析模块

  1. 生成统计数据
  2. 统计数据图表显示

三、项目前台用户系统功能

1. 首页数据显示

  • 显示幻灯片功能
  • 显示热门课程
  • 显示名师

2. 注册功能

  • 获取手机验证码

3. 登录功能

  1. 普通登录和注册

SSO(单点登录)
单点登录三种常见的方式:

- 第一种:session广播机制实现
- 第二种:使用cookie + redis 实现
- 使用 token 实现

 

**JWT**

- 使用JWt生成token字符串
- JWT有三部分组成

 

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

  1. 微信扫描登录
    OAuth2

    • 是针对特定问题解决方案
    • 主要有两个问题:开放系统间授权,分布式访问

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

    • 扫描之后微信接口返回code(临时票据),拿着code值请求微信固定地址,得到两个值:access_token(访问凭证)和openid(微信唯一标识),你拿着这两个值再去请求微信固定的地址,得到微信扫描人信息(比如昵称,头像等等)。

4. 名师列表功能

5. 名师详情列表

6. 课程列表功能

  • 多功能查询分页列表功能

7. 课程详情页

  • 课程信息显示(包含课程基本信息,分类,讲师,课程大纲)。
  • 判断课程是否需要购买。

8. 课程视频在线播放

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

  • 生成课程订单
  • 生成微信支付二维码
  • 微信最终支付

    微信支付实现流程:

    • 如果课程是收费课程,点击立即购买,生成课程订单。
  • 点击订单页面去支付,生成微信支付二维码。
  • 使用微信扫描支付二维码实现支付。
  • 支付之后,每隔3秒查询支付状态(是否支付成功),如果没有支付成功等待,如果支付成功之后,更新订单状态(已经支付状态),向支付记录表添加支付成功记录。

总结在线教育项目技术点(前端)

一、在线教育项目采用前后端分离开发

二、项目使用前端技术

1.vue

  • 基本语法
  • 常见指令 : v-bind v-model v-if v-for v-html
  • 绑定事件: v-on-click @click

    • 生命周期:created():页面渲染之前 mounted():页面渲染之后
  • ES6规范

2. Element-ui

3. nodejs

  • 是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

  • 图表工具

总结在线教育项目技术点(后端技术一)

1. 项目采用微服务架构

2. SpringBoot

(1)SpringBoot本质是就是Spring,只是快速构建Spring工程脚手架
(2)细节:

  • 启动类包扫描机制
  • 设置扫描规则 @ComponentScan("包路径")
  • 配置类

(3)SpringBoot配置文件

  • 配置文件类型:properties和yml
  • 配置文件加载顺序:bootstrap application application-dev

3. SpringCloud

(1)是很多框架总称,使用这些框架实现微服务架构,基于SpringBoot实现
(2)组成框架有哪些?

  • 服务发现——Netflix Eureka (Nacos)
  • 服务调用——Netflix Feign
  • 熔断器——Netflix Hystrix
  • 服务网关——Spring Cloud GateWay
  • 分布式配置——Spring Cloud Config (Nacos)
  • 消息总线 —— Spring Cloud Bus (Nacos)

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

(4)Nacos

  • 使用Nacos作为注册中心
  • 使用Nacos作为配置中心

(5)Feign

  • 服务调用,一个微服务调用另外一个微服务,实现远程调用

(6)熔断器

(7)Gateway网关

  • SpringCloud之前zuul网关,目前Gateway网关

(8)版本

4. MyBatisPlus

(1)MyBatisPlus就是对MyBatis做增强

(2)自动填充

(3)乐观锁

(4)逻辑删除

(5)代码生成器

5. EasyExcel

(1)阿里巴巴提供操作excel工具,代码简洁,效率很高

(2)EasyExcel对poi进行封装,采用SAX方式解析

(3)项目应用在添加课程分类,读取excel数据


总结在线教育项目技术点(后端技术二)

1. Spring Security

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

(2)SpringSecurity框架组成:认证和授权

(3)SpringSecurity登录认证过程

(4)SpringSecurity代码执行过程

2. Redis

(1)首页数据通过Redis进行缓存

(2)Redis数据类型

(3)使用Redis作为缓存,不太重要或者不经常改变数据适合放到Redis作为缓存

3. Nginx

(1)反向代理服务器

(2)请求转发,负载均衡,动静分离

4. OAuth2+JWT

(1)OAuth2针对特定问题解决方案

(2)JWT包含三部分

5. HttpClient

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

(2)应用场景:微信登录获取扫描人信息,微信支付查询支付状态

6. Cookie

(1)Cookie特点:

  • 客户端技术
  • 每次发送请求带着cookie值进行发送
  • cookie有默认会话级别,关闭浏览器cookie默认不存在了,
  • 但是可以设置cookie有效时长 setMaxAge

7. 微信登录

8. 微信支付

9. 阿里云OSS

(1)文件存储服务器

(2)添加讲师时候上传讲师头像

10. 阿里云视频点播

(1)视频上传、删除、播放

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

  • 使用视频播放凭证

11. 阿里云短信服务

(1)注册时候,发送手机验证码

12. Git

(1)代码提交到远程Git仓库

13. Docker+Jenkins

(1)手动打包运行

(2)idea打包

(3)jenkins自动化部署过程


总结在线教育项目问题

1. 前端问题-路由切换问题

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

(2)解决方案:使用vue监听

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

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

3. mp生成19位id值

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

4. 跨域问题

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

(2)跨域解决:

  • 在Controller添加注解
  • 通过网关解决

5. 413问题

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

(2)413错误:请求体过大

(3)在Nginx配置客户端大小

(4)响应状态码:413 403 302

6. Maven加载问题

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

(2)解决方案:

  • 直接复制xml文件到target目录
  • 通过配置实现

面试总结

1. 项目描述

(1)
在线教育系统,分为前台网站系统和后台运营平台,B2C模式。

前台用户系统包括课程、讲师、问答、文章几大大部分,使用了微服务技术架构,前后端分离开发.

后端的主要技术架构是:SpringBoot + SpringCloud + MyBatis-Plus + HttpClient + MySQL + Maven+EasyExcel+ nginx

前端的架构是:Node.js + Vue.js +element-ui+NUXT+ECharts

其他涉及到的中间件包括Redis、阿里云OSS、阿里云视频点播

业务中使用了ECharts做图表展示,使用EasyExcel完成分类批量添加、注册分布式单点登录使用了JWT

(2)
项目前后端分离开发,后端采用SpringCloud微服务架构,持久层用的是MyBatis-Plus,微服务分库设计,使用Swagger生成接口文档

接入了阿里云视频点播、阿里云OSS。

系统分为前台用户系统和后台管理系统两部分。

前台用户系统包括:首页、课程、名师、问答、文章。

后台管理系统包括:讲师管理、课程分类管理、课程管理、统计分析、Banner管理、订单管理、权限管理等功能。

在线教育计费案例:
小A是一名杭州的创业者,带领团队研发了一个在线教育平台。他希望把视频托管在阿里云上,存量视频大约1000个,占用存储空间近1T,每月预计新增视频100个,并新增存储约100G,课程视频的时长集中在20-40分钟,并且按照不同课程进行分类管理。为了保障各端的观看效果,计划为用户提供“标清480P”和“高清720P”两种清晰度。目前已有用户400人左右,每日平均视频观看次数1000次,在移动端和PC端观看次数比例大致为3:1。


2. 这是一个项目还是一个产品

1.0版本是单体应用:SSM
2.0版本加入了SpringCloud,将一些关键业务和访问量比较大的部分分离了出去
目前独立出来的服务有教学服务、视频点播服务、用户服务、统计分析服务、网关服务

3. 测试要求

首页和视频详情页qps单机qps要求 2000+
经常用每秒查询率来衡量域名系统服务器的机器的性能,其即为QPS
QPS = 并发量 / 平均响应时间

4. 企业中的项目(产品)开发流程

一个中大型项目的开发流程:
(1)需求调研(产品经理)
(2)需求评审(产品/设计/前端/后端/测试/运营)
(3)立项(项目经理、品管)
(4)UI设计
(5)开发、架构、数据库设计、API文档、MOCK数据、开发、单元测试、前端、后端
(6)前端后端联调
(7)项目提测:黑盒白盒、压力测试(qps) loadrunner
(8)bug修改
(9)回归测试
(10)运维和部署上线
(11)灰度发布
(12)全量发布
(13)维护和运营

5. 系统中都有那些角色?数据库是怎么设计的?

前台:会员(学员)

后台:系统管理员、运营人员

后台分库,每个微服务一个独立的数据库,使用了分布式id生成器

6. 视频点播是怎么实现的(流媒体你们是怎么实现的)

我们直接接入了阿里云的云视频点播。云平台上的功能包括视频上传、转码、加密、智能审核、监控统计等。

还包括视频播放功能,阿里云还提供了一个视频播放器。

7. 前后端联调经常遇到的问题:

  • 请求方式post、get

    • json、x-wwww-form-urlencoded混乱的错误
  • 后台必要的参数,前端省略了
  • 数据类型不匹配
  • 空指针异常
  • 分布式系统中分布式id生成器生成的id 长度过大(19个字符长度的整数),js无法解析(js智能解析16个长度:2的53次幂)
  • id策略改成 ID_WORKER_STR

8.前后端分离项目中的跨域问题是如何解决的

后端服务器配置:我们的项目中是通过Spring注解解决跨域的 @CrossOrigin

也可以使用nginx反向代理、httpClient、网关

9. 分布式系统的CAP原理

CAP定理:
指的是在一个分布式系统中,Consistency(一致性)、 Availability(可用性)、Partition tolerance(分区容错性),三者不可同时获得。

  • 一致性(C):在分布式系统中的所有数据备份,在同一时刻是否同样的值。(所有节点在同一时间的数据完全一致,越多节点,数据同步越耗时)
  • 可用性(A):负载过大后,集群整体是否还能响应客户端的读写请求。(服务一直可用,而且是正常响应时间)
  • 分区容错性(P):分区容错性,就是高可用性,一个节点崩了,并不影响其它的节点(100个节点,挂了几个,不影响服务,越多机器越好)

CA 满足的情况下,P不能满足的原因:
数据同步(C)需要时间,也要正常的时间内响应(A),那么机器数量就要少,所以P就不满足

CP 满足的情况下,A不能满足的原因:
数据同步(C)需要时间, 机器数量也多(P),但是同步数据需要时间,所以不能再正常时间内响应,所以A就不满足

AP 满足的情况下,C不能满足的原因:
机器数量也多(P),正常的时间内响应(A),那么数据就不能及时同步到其他节点,所以C不满足

注册中心选择的原则:
Zookeeper:CP设计,保证了一致性,集群搭建的时候,某个节点失效,则会进行选举行的leader,或者半数以上节点不可用,则无法提供服务,因此可用性没法满足
Eureka:AP原则,无主从节点,一个节点挂了,自动切换其他节点可以使用,去中心化

结论:
分布式系统中P,肯定要满足,所以我们只能在一致性和可用性之间进行权衡
如果要求一致性,则选择zookeeper,如金融行业
如果要求可用性,则Eureka,如教育、电商系统
没有最好的选择,最好的选择是根据业务场景来进行架构设计

10. 前端渲染和后端渲染有什么区别

前端渲染是返回json给前端,通过javascript将数据绑定到页面上

后端渲染是在服务器端将页面生成直接发送给服务器,有利于SEO的优化

11. 系统架构图

在这里插入图片描述


创作不易,如果有帮助到你,请给文章==点个赞和收藏==,让更多的人看到!!!
==关注博主==不迷路,内容持续更新中。

相关实践学习
基于Redis实现在线游戏积分排行榜
本场景将介绍如何基于Redis数据库实现在线游戏中的游戏玩家积分排行榜功能。
云数据库 Redis 版使用教程
云数据库Redis版是兼容Redis协议标准的、提供持久化的内存数据库服务,基于高可靠双机热备架构及可无缝扩展的集群架构,满足高读写性能场景及容量需弹性变配的业务需求。 产品详情:https://www.aliyun.com/product/kvstore     ------------------------------------------------------------------------- 阿里云数据库体验:数据库上云实战 开发者云会免费提供一台带自建MySQL的源数据库 ECS 实例和一台目标数据库 RDS实例。跟着指引,您可以一步步实现将ECS自建数据库迁移到目标数据库RDS。 点击下方链接,领取免费ECS&RDS资源,30分钟完成数据库上云实战!https://developer.aliyun.com/adc/scenario/51eefbd1894e42f6bb9acacadd3f9121?spm=a2c6h.13788135.J_3257954370.9.4ba85f24utseFl
目录
相关文章
|
9月前
|
定位技术
ArcMap:第一届全国大学生GIS技能大赛(滁州学院)详解-下午题2
ArcMap:第一届全国大学生GIS技能大赛(滁州学院)详解-下午题
141 0
|
9月前
|
移动开发 前端开发 Java
JavaWeb实训项目 河南省旅游指南(上)
JavaWeb实训项目 河南省旅游指南
87 0
|
9月前
|
SQL 前端开发 Java
JavaWeb实训项目 河南省旅游指南(下)
JavaWeb实训项目 河南省旅游指南(下)
57 1
|
9月前
|
定位技术
ArcMap:第一届全国大学生GIS技能大赛(滁州学院)详解-下午题1
ArcMap:第一届全国大学生GIS技能大赛(滁州学院)详解-下午题
167 0
|
10月前
|
数据可视化 Java 关系型数据库
某学院校园网站的设计与实现(论文+源码)_kaic
摘  要 使用旧方法对冀中工程技师学院网站的信息进行系统化管理已经不再让人们信赖了,把现在的网络信息技术运用在冀中工程技师学院网站的管理上面可以解决许多信息管理上面的难题,比如处理数据时间很长,数据存在错误不能及时纠正等问题。这次开发的冀中工程技师学院网站对字典管理、留言板管理、新闻资讯信息管理、师资力量管理、师资力量收藏管理、师资力量留言管理、单页数据管理、校园风光管理、校园风光收藏管理、校园风光留言管理、学生管理、管理员管理等进行集中化处理。经过前面自己查阅的网络知识,加上自己在学校课堂上学习的知识,决定开发系统选择B/S模式这种高效率的模式完成系统功能开发。这种模式让操作员基于浏览器的方
|
jenkins Java 持续交付
谷粒学院——Day19【项目部署】
谷粒学院——Day19【项目部署】
232 0
谷粒学院——Day19【项目部署】
|
编解码 JavaScript 前端开发
谷粒学院——Day04【项目前端相关基础知识二】
谷粒学院——Day04【项目前端相关基础知识二】
83 0
谷粒学院——Day04【项目前端相关基础知识二】
|
存储 JavaScript 前端开发
谷粒学院——Day03【项目前端相关基础知识一】
谷粒学院——Day03【项目前端相关基础知识一】
74 0
谷粒学院——Day03【项目前端相关基础知识一】
|
JavaScript 数据可视化 前端开发
谷粒学院——Day16【统计分析】
谷粒学院——Day16【统计分析】
121 0
谷粒学院——Day16【统计分析】
|
前端开发 安全 JavaScript
谷粒学院——Day14【首页课程和名师功能】
谷粒学院——Day14【首页课程和名师功能】
313 0
谷粒学院——Day14【首页课程和名师功能】