开发在线教育项目-在线课程视频网站开发

用了哪些技术

后端技术

  • springboot3+ security权限框架(后台)
  • mybatisPlus框架
  • jwt生成token
  • easyexcel导入导出
  • 递归查询
  • 拦截器校验token
  • redis的zset做排行榜功能
  • redis的list做最新课程的功能
  • redis做为缓存技术
  • redis作为计数器,实时记录浏览量,评论数,购买数等(hash的自增)
  • 定时任务(Quartz)
  • elasticsearch做了全文检索-中文分词-高亮显示等复杂的查询(ElasticsearchRepository )
  • 阿里云视频点播技术
  • 阿里云oss对象存储技术
  • 支付宝当面付对接(沙箱环境+natapp内网穿透技术)
  • 图形验证码功能
  • 短信验证码接口对接

前端技术

  • 前台采用nuxt框架(为了良好的seo搜索引擎优化,因为传统的vue项目生成的页面是空的,只有在渲染页面以后才会拿到数据,这样各大搜索引擎平台的蜘蛛不喜欢)
  • 后台用的是vue-admin-template模板,核心还是vue2+elementui
  • axios请求封装(请求拦截器和响应拦截器)
  • 异步请求(async+await)

思维导图

后台功能介绍

登录

(1)登录页面
image.png
(2)用户名需要是正确的,做了非空验证,并且输入用户名的时候,需要在数据库比对,没有的话会输出“用户名不存在”
(3)密码有验证:输入6位数密码,密码不对会有说明。

后台主页

image.png

课程管理

有课程列表和添加课程
(1)课程列表:用户进来可以看到以列表显示的课程信息,可以按课程名称,课程状态进行搜索,可以编辑课程基本信息,可以编辑课程大纲信息,删除课程信息。
image.png
①编辑基本信息
image.png
②编辑课程大纲
image.png
③删除课程,点击删除按钮,会弹出对话框确认是否删除
image.png
④如果该课程下有章节信息,则不可以删除该章节
image.png
⑤添加课程:进来之后可以添加课程,填写课程信息,上传课程图片,填写课程价格(如果输入的是0就是免费课程)。保存进入下一步,进入课程界面,点击立即生效(添加了章节小节后想让前端立即看到最新的修改的话),就可以在前端看到发布的新课程了。
image.pngimage.png
image.png

课程分类

包括课程分类列表和导入课程分类
①课程分类列表:用户进来可以看到全部的课程分类,可以在搜索框内输入关键字,就会自动查到含有关键字的课程分类。
image.png
②导入课程分类:用户进来之后可以按表的格式进行上传,添加课程分类。再上传到服务器。
image.pngimage.png

轮播图

进入轮播图列表,如下可以看到轮播图的详细信息,可以对轮播图进行添加、修改和删除。点击添加可以添加新的轮播图,点击修改可以修改该轮播图信息,点击删除,可以对不需要的轮播图进行删除,有确认删除的提示框,确认删除后就会删除该条记录。
image.pngimage.png

讲师管理

有讲师列表和添加讲师
image.png
①讲师列表:可以按讲师的名称,头衔,时间进行搜索。可以修改讲师和删除讲师。修改讲师,点进去之后可以修改讲师的所有信息。讲师的图像鼠标放上后会旋转移开,如下图。
image.png
删除讲师,点击删除按钮提示不允许访问,业务上是不能对讲师进行删除,因为讲师下面都有课程。。
②添加讲师:点击进入之后可以添加讲师信息,和修改讲师的页面是一样的

image.png

前台功能介绍

注册

注册的时候是要发手机短信验证码的,以确保用户的手机号填写的是正确的手机号(能收到手机短信那说明是他本人的手机)。为了防止黑客攻击这个短信接口(随便输入手机号都要给该手机号发短信浪费钱),这里在发送短信验证码之前先得要求用户输入正确的图形验证码才给发短信,这样就能有效防止恶意攻击。
image.png

登录

image.png
第三方登录的功能暂时没写。

首页

核心部分主要是轮播图的展示,最新课程展示(用的是redis的list特性,无论后台添加了多少门课程,首页这里最多展示8个),讲师排行榜(redis的zset实现的),导航栏的话主要是全文检索的搜索框,个人中心等。
image.png

讲师详情

查询出该讲师的基本信息以及该老师主讲的课程
image.png

课程分页展示

这块的功能是用elasticsearch写的,因为这个属于复杂条件查询(比如分类查询,销量升序降序等),而且实际项目中课程是海量的。
image.png

全文检索

这里用了es的全文检索,并且是高亮显示,还用了ik分词器(用户输入一段话可以拆分成几个关键词),极大得增加了猜到用户想要的课程是啥,大大提高了用户体验。

课程详情

这块的难点主要有,浏览量、购买数这些数据都是实时的,采用的是redis的计数器功能。课程大纲那块也是难点,要判断当前登录者是否购买了课程,如果购买了的话可以直接播放,如果没购买的话就是显示立即购买的按钮,如果是免费试听课,就直接显示免费试听,如果是免费课程但当前登录者没有报名的话,显示立即报名。
还有就是报名或购买过的客户不用重复报名或购买同一个课。
视频播放用的是阿里云播放器(我们平台的视频都是采用的阿里云视频点播技术的)
最后这里涉及到经常查询的地方放到redis缓存(比如课程大纲章节和小节,课程基本信息等)
image.png
image.png
image.png

立即购买

这个功能比较简单,当进入到这个页面的时候就已经产生了一个待支付的订单,注意刷新页面的时候不要产生新的订单(登陆者已经下过该课程的订单的话就不会产生新的订单了)
image.png

去支付

这个功能比较复杂,这是用的支付宝的沙箱支付,生成付款二维码。进入这个页面会不断询问后端,后端给支付宝官方发请求询问用户是否已经扫码支付成功,直到倒计时结束还没支付成功的话就因为用户展示放弃支付,跳到用户的订单中心去支付。特别注意2小时还没支付的话,支付宝那边会将订单超时关闭,所以这个时候我们应该逻辑删除该订单,相当于订单作废,因为订单超时关闭后必须用新的订单号才能生成新的付款二维码。
image.png

个人中心

修改密码,我的订单,修改头像,查看评论等功能
image.png
image.png

评论课程

只有购买或者报名过该课程的人才可以评论课程,自己可以删除自己的评论,但不能删除别人的评论。
image.png

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/866640.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

搞定Loki+Promtail轻量级日志系统

Promtail 是 Loki 的日志收集客户端,它的主要功能是从各种来源收集日志并将其发送到 Loki 进行存储和查询。Promtail 的设计使其能够高效地收集和处理日志数据。 promtail-config.yaml(配置): Promtail 读取配置文件(例如 promta…

初阶数据结构二叉树练习系列(1)

这个系列的文章将带大家一起刷题,并且总结思路 温馨提示:本篇文章里的练习题仅适合刚学完二叉树的小白使用 相同的树 思路 情况分析:第一种情况:两棵树都为空 → 返回true 第二种情况&am…

C++ 引用——引用的基本语法

引用的基本使用 作用:给变量起别名 语法:数据类型 &别名 原名 示例: 运行结果:

如何利用Kimi解读Kimi的KVCache技术细节

最近Kimi公布了一篇Mooncake: Kimis KVCache-centric Architecture for LLM Serving的文章,详细介绍了Kimi背后的推理架构,因此笔者想到用Kimi解读Kimi,梳理相关技术要点如下,供大家参考: 文章 "Mooncake: A KVCa…

JVM原理(三):JVM对象回收判定机制与回收算法

如何判断一个对象是否存活(即是否还分配在堆中),那看他是否还在用。 1. 引用计数算法 这是一种判断方式,相应的方法就是:如果一个对象被引用,那将被引用的对象中的一个计数器加一,引用失效就减一。在任何时刻引用计数…

STM32自己从零开始实操07:电机电路原理图

一、LC滤波电路 其实以下的滤波都可以叫低通滤波器。 1.1倒 “L” 型 LC 滤波电路 1.1.1定性分析 1.1.2仿真实验 电感:通低频阻高频的。仿真中高频信号通过电感,因为电感会阻止电流发生变化,故说阻止高频信号 电容:隔直通交。…

免费分享:中国三级及以上河流(附下载方法)

河流分级法的分级方法是从源头最小河流开始,称为一级河流;两条一级河流汇合成二级河流;以此类推,三级河流等等;最后是干流。本文将介绍中国三级及以上河流数据。 数据简介 1:100万中国三级及以上河流矢量数据是涵盖了全国范围内三级及以上级别河流的详细地理信息和空间分布。这…

App Store迎来了重磅更新,ASO冲榜优化或将成为不可或缺的一部分

近日App Store搜索页面迎来了重磅更新,苹果应用商店中搜索页面原有的热搜关键词消失了取而代之的是直接将排行榜放在了搜索顶部,分别是APP排行和游戏排行两部分。如下图: 很多人应该都是参考排行榜来下载APP的,这次更新之后用户在…

基于工业互联网的智能制造:未来制造业的新引擎

随着科技的飞速发展,工业互联网通过提供强大的数据支撑和通信基础,成为智能制造的重要基石。智能制造的引入,不仅显著提升了制造业的生产效率、降低了成本,而且提高了产品质量,满足了市场的多样化、个性化需求。 智能制…

解决问题:使用PageHelper.startPage和PageInfo实现分页,但是得到的total和传入的页面大小pageSize一样

我们需要的是total得到的数值是数据库里所有数据的条数。 1、包别引错 <!--PageHelper开始--><dependency><groupId>com.github.pagehelper</groupId><artifactId>pagehelper-spring-boot-starter</artifactId><version>1.4.6</…

kafka 生产者

生产者 生产者负责创建消息&#xff0c;然后将其投递到Kafka中。 负载均衡 轮询策略。随机策略。按照 key 进行hash。 Kafka 的默认分区策略&#xff1a;如果指定了 key&#xff0c;key 相同的消息会发送到同一个分区&#xff08;分区有序&#xff09;&#xff1b;如果没有…

光伏储能电厂设备连接iec61850平台解决方案

在当今日益发展的电力系统中&#xff0c;光伏储能技术以其独特的优势逐渐崭露头角&#xff0c;成为可再生能源领域的重要组成部分。而在光伏储能系统的运行与监控中&#xff0c;通信协议的选择与实现则显得至关重要。本文将重点介绍光伏储能系统中的Modbus协议、电力IEC 61850平…

reids一主多从配置

-----------------跳过了安装redis的过程--------------------------- 主192.168.25.129从 192.168.25.130从 192.168.25.133 redis主从复制环境&#xff0c;基本上都是在从服务器上修改相关的配置 1、在俩台从服务器分别给 reids.conf文件添加master…

【深度学习练习】心脏病预测

&#x1f368; 本文为&#x1f517;365天深度学习训练营 中的学习记录博客&#x1f356; 原作者&#xff1a;K同学啊 一、什么是RNN RNN与传统神经网络最大的区别在于&#xff0c;每次都会将前一次的输出结果&#xff0c;带到下一隐藏层中一起训练。如下图所示&#xff1a; …

Docker 运行Nacos无法访问地址解决方法

参考我的上一篇文章去配置好镜像加速器&#xff0c;镜像加速器不是配置越多越好&#xff0c;重试次数多了会失败 Dockerhub无法拉取镜像配置阿里镜像加速器-CSDN博客 错误的尝试 最开始按照网上的方式去配了一大堆&#xff0c;发现下不下来。 镜像源地址&#xff1a;https:…

Oracle 解决4031错误

一、问题描述 什么是4031错误和4031错误产生的原因: 简单一个句话概括: 由于服务器一直在执行大量的硬解析,导致Oracle 的shared pool Free空间碎片过多,大的chunk不足, 当又一条复杂的sql语句要硬解析时, 缺少1个足够大的Free chunk, 通常就会报4031错误. 二、解决方法 临…

模拟退火算法4—应用

TSP&#xff08;旅行商&#xff09;问题是最有代表性的优化组合问题之一&#xff0c;其应用已逐步渗透到各个技术领域和我们的日常生活中.它一开始是为交通运输而提出的&#xff0c;比如飞机航线安排、送邮件、快递服务、设计校车行进路线等等.实际上其应用范围扩展到了许多其他…

揭秘数据之美:【Seaborn】在现代【数学建模】中的革命性应用

目录 已知数据集 tips 生成数据集并保存为CSV文件 数据预览&#xff1a; 导入和预览数据 步骤1&#xff1a;绘制散点图&#xff08;Scatter Plot&#xff09; 步骤2&#xff1a;添加回归线&#xff08;Regression Analysis&#xff09; 步骤3&#xff1a;分类变量分析&…

如何查看MCU编译生成的elf(out)文件内容

一般地&#xff0c;我们想要知道单片机程序编译完后的结构我们可以查看map文件或者是elf/out文件&#xff0c;map文件不能看函数的汇编格式&#xff0c;只能查看编译完成后变量、代码的地址和占用空间大小&#xff0c;而elf文件里面更加详细&#xff0c;还包含了函数的汇编&…