谷粒学院(十四)轮播图前后台 | 整合Redis | 单点登录(二)

简介: 谷粒学院(十四)轮播图前后台 | 整合Redis | 单点登录(二)

4、首页显示课程名师数据


(1)在api中定义接口—index.js

import request from '@/utils/request'
export default {
    //查询前两条banner数据
    findCourseAndTeacher(){
        return request({
            url:`/eduservice/index/findCourseAndTeacher`,
            method:'get'
        })
    }
}

(2)在index.vue页面调用接口得到数据进行显示

created() {
    //...
    //查询讲师和课程
    this.getCourseAndTeacher()
  },
  methods: {
    //...
    //查询热门课程和讲师
    getCourseAndTeacher(){
      index.findCourseAndTeacher()
      .then(response=>{
        this.courseList = response.data.data.courseList
        this.teacherList =response.data.data.teacherList
      })
    }
  }

(3)课程模块遍历显示

<li v-for="course in eduList" :key="course.id">
  <div class="cc-l-wrap">
    <section class="course-img">
      <img
        :src="course.cover"
        class="img-responsive"
        :alt="course.title"
      >
      <div class="cc-mask">
        <a href="#" title="开始学习" class="comm-btn c-btn-1">开始学习</a>
      </div>
    </section>
    <h3 class="hLh30 txtOf mt10">
      <a href="#" :title="course.title" class="course-title fsize18 c-333">{{course.title}}</a>
    </h3>
    <section class="mt10 hLh20 of">
      <span class="fr jgTag bg-green" v-if="Number(course.price) === 0">
        <i class="c-fff fsize12 f-fA">免费</i>
      </span>
      <span class="fr jgTag bg-green" v-else>
        <i class="c-fff fsize12 f-fA">¥{{course.price}}</i>
      </span>
      <span class="fl jgAttr c-ccc f-fA">
        <i class="c-999 f-fA">{{course.buyCount}} 人学习</i>
        |
        <i class="c-999 f-fA">{{course.viewCount}} 人浏览</i>
      </span>
    </section>
  </div>
</li>

(4)名师模块遍历显示

<li v-for="teacher in teacherList" :key="teacher.id">
  <section class="i-teach-wrap">
    <div class="i-teach-pic">
      <a href="/teacher/1" :title="teacher.name">
        <img :alt="teacher.name" :src="teacher.avatar">
      </a>
    </div>
    <div class="mt10 hLh30 txtOf tac">
      <a href="/teacher/1" :title="teacher.name" class="fsize18 c-666">{{teacher.name}}</a>
    </div>
    <div class="hLh30 txtOf tac">
      <span class="fsize14 c-999">{{teacher.career}}</span>
    </div>
    <div class="mt15 i-q-txt">
      <p
        class="c-999 f-fA"
      >{{teacher.intro}}</p>
    </div>
  </section>
</li>

(5)效果展示



c56c272b56413e2ad61cdcac043ed34c.png


2e11b8c50ed403f98f1d7bd22ea9a2f8.png


四、首页数据添加Redis缓存


1、Redis介绍


Redis是当前比较热门的NOSQL系统之一,它是一个开源的使用C语言编写的key-value存储系统(区别于MySQL的二维表格的形式存储)。和Memcache类似,但很大程度补偿了Memcache的不足。Memcache一样,Redis数据都是缓存在计算机内存中,不同的是,Memcache只能将数据缓存到内存中,无法自动定期写入硬盘,这就表示,一断电或重启,内存清空,数据丢失。所以Memcache的应用场景适用于缓存无需持久化的数据。而Redis不同的是它会周期性的把更新的数据写入磁盘或者把修改操作写入追加的记录文件,实现数据的持久化。


Redis的特点:


Redis读取的速度是110000次/s,写的速度是81000次/s;

原子 。Redis的所有操作都是原子性的,同时Redis还支持对几个操作全并后的原子性执行。

支持多种数据结构:string(字符串);list(列表);hash(哈希),set(集合);zset(有序集合)

持久化,集群部署

支持过期时间,支持事务,消息订阅


一般来说,把经常进行查询,不经常修改,不是特别重要的数据放在redis作为缓存。


2、项目集成Redis


(1)在common模块添加依赖

<!-- redis -->
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-data-redis</artifactId>
</dependency>
<!-- spring2.X集成redis所需common-pool2-->
<dependency>
    <groupId>org.apache.commons</groupId>
    <artifactId>commons-pool2</artifactId>
    <version>2.6.0</version>
</dependency>


(2)在service_base模块添加redis配置文件

RedisConfig类

@EnableCaching //开启缓存
@Configuration  //配置类
public class RedisConfig extends CachingConfigurerSupport {
    @Bean
    public RedisTemplate<String, Object> redisTemplate(RedisConnectionFactory factory) {
        RedisTemplate<String, Object> template = new RedisTemplate<>();
        RedisSerializer<String> redisSerializer = new StringRedisSerializer();
        Jackson2JsonRedisSerializer jackson2JsonRedisSerializer = new Jackson2JsonRedisSerializer(Object.class);
        ObjectMapper om = new ObjectMapper();
        om.setVisibility(PropertyAccessor.ALL, JsonAutoDetect.Visibility.ANY);
        om.enableDefaultTyping(ObjectMapper.DefaultTyping.NON_FINAL);
        jackson2JsonRedisSerializer.setObjectMapper(om);
        template.setConnectionFactory(factory);
        //key序列化方式
        template.setKeySerializer(redisSerializer);
        //value序列化
        template.setValueSerializer(jackson2JsonRedisSerializer);
        //value hashmap序列化
        template.setHashValueSerializer(jackson2JsonRedisSerializer);
        return template;
    }
    @Bean
    public CacheManager cacheManager(RedisConnectionFactory factory) {
        RedisSerializer<String> redisSerializer = new StringRedisSerializer();
        Jackson2JsonRedisSerializer jackson2JsonRedisSerializer = new Jackson2JsonRedisSerializer(Object.class);
        //解决查询缓存转换异常的问题
        ObjectMapper om = new ObjectMapper();
        om.setVisibility(PropertyAccessor.ALL, JsonAutoDetect.Visibility.ANY);
        om.enableDefaultTyping(ObjectMapper.DefaultTyping.NON_FINAL);
        jackson2JsonRedisSerializer.setObjectMapper(om);
        // 配置序列化(解决乱码的问题),过期时间600秒
        RedisCacheConfiguration config = RedisCacheConfiguration.defaultCacheConfig()
                .entryTtl(Duration.ofSeconds(600))
                .serializeKeysWith(RedisSerializationContext.SerializationPair.fromSerializer(redisSerializer))
                .serializeValuesWith(RedisSerializationContext.SerializationPair.fromSerializer(jackson2JsonRedisSerializer))
                .disableCachingNullValues();
        RedisCacheManager cacheManager = RedisCacheManager.builder(factory)
                .cacheDefaults(config)
                .build();
        return cacheManager;
    }
}

3、在接口中添加redis缓存


由于首页数据变化不是很频繁,而且首页访问量相对较大,所以我们有必要把首页接口数据缓存到redis缓存中,减少数据库压力和提高访问速度。


改造service-cms模块首页banner接口,首页课程与讲师接口类似


Spring Boot缓存注解说明


(1)缓存@Cacheable


根据方法对其返回结果进行缓存,下次请求时,如果缓存存在,则直接读取缓存数据返回;如果缓存不存在,则执行方法,并把返回的结果存入缓存中。一般用在查询方法上。


查看源码,属性值如下:


属性/方法名 解释
value 缓存名,必填,它指定了你的缓存存放在哪块命名空间
cacheNames 与 value 差不多,二选一即可
key 可选属性,可以使用 SpEL 标签自定义缓存的key


(2)缓存@CachePut


使用该注解标志的方法,每次都会执行,并将结果存入指定的缓存中。其他方法可以直接从响应的缓存中读取缓存数据,而不需要再去查询数据库。一般用在新增方法上。


查看源码,属性值如下:


属性/方法名 解释
value 缓存名,必填,它指定了你的缓存存放在哪块命名空间
cacheNames 与 value 差不多,二选一即可
key 可选属性,可以使用 SpEL 标签自定义缓存的key


(3)缓存@CacheEvict


使用该注解标志的方法,会清空指定的缓存。一般用在更新或者删除方法上


查看源码,属性值如下:


属性/方法名 解释
value 缓存名,必填,它指定了你的缓存存放在哪块命名空间
cacheNames 与 value 差不多,二选一即可
key 可选属性,可以使用 SpEL 标签自定义缓存的key
allEntries 是否清空所有缓存,默认为 false。如果指定为 true,则方法调用后将立即清空所有的缓存
beforeInvocation 是否在方法执行前就清空,默认为 false。如果指定为 true,则在方法执行前就会清空缓存


4、service_cms模块接口改造


(1)在service-cms模块配置文件添加redis配置


spring.redis.host=192.168.174.128
spring.redis.port=6379
spring.redis.database= 0
spring.redis.timeout=1800000
spring.redis.lettuce.pool.max-active=20
spring.redis.lettuce.pool.max-wait=-1
#最大阻塞等待时间(负数表示没限制)
spring.redis.lettuce.pool.max-idle=5
spring.redis.lettuce.pool.min-idle=0

(2)修改CrmBannerServiceImpl类中的方法,添加redis缓存注解


1b14430e4952790f442ca5c0ae212e89.png

a7c981f809b779c9aab168a66c8e53cc.png

同样,也可以为首页名师模块、课程模块添加Redis缓存.(此处以名师模块为例)


88bdf843aeeaf0d2f984387897e1d519.png

1d0b3490186f1ddd6286be719f34c50a.png

(3)访问首页后 查看redis


70fa4e6d5bd073e7651957ee773f6a63.png


**现象:**当第一次访问首页,查询数据库,把数据存入redis缓存.之后访问首页,数据直接从redis中获取. 当进行 banner/teacher/course的增删改操作时,清空对应的redis缓存,下次访问首页形成新的redis缓存.


五、单点登录与用户业务介绍


1、单一服务器模式


早期单一服务器,用户认证。


0c33fa90b0c19a093a3aa49438338431.gif


使用session对象实现:登录成功之后,把用户数据放到session里面;判断是否登录,从session获取数据,可以获取到登录。


缺点:单点性能压力大,无法扩展


2、 SSO(single sign on) 模式【也叫单点登录】


分布式,SSO(single sign on)模式


e5b82f5d0bc387be1a642fff298f3db4.gif


优点 :


  • 用户身份信息独立管理,更好的分布式管理。
  • 可以自己扩展安全策略


缺点:


  • 认证服务器访问压力较大。


单点登录三种常见方式:


  • session广播机制实现 — 简单说就是session复制。
  • 使用cookie + redis 实现


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

(1)redis,在key:生成唯一随机值,在value:用户数据

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


访问项目中其他模块,发送请求带着cookie进行发送,获取cookie值,拿着cookie做事情;把cookie获取到的值,到redis进行查询,根据key进行查询,如果查询到数据就是已经登陆!


使用token实现(后文介绍)

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

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

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

再去访问项目其他模块,每次访问在地址栏带着生成的token字符串,在访问模块里面获取地址栏字符串,根据字符串获取用户信息。如果可以获取到,就是登陆


3、Token模式


token【令牌】是什么:按照一定规则生成字符串,字符串可以包含用户信息。


业务流程图{用户访问业务时,必须登录的流程}

dbafed4711eaa61fd168d0284c9c3f01.gif


优点:


  • 无状态: token无状态,session有状态的
  • 基于标准化: 你的API可以采用标准化的 JSON Web Token (JWT)


缺点:


  • 占用带宽
  • 无法在服务器端销毁


**注:**基于微服务开发,选择token的形式相对较多,因此我使用token作为用户认证的标准


4、三种单点登录方式的图解


25b319e07ad1517aee5208c87972a7db.png

相关文章
|
NoSQL Java Redis
springboot搭建后台框架 (二)整合Redis
springboot搭建后台框架 (二)整合Redis
285 0
|
NoSQL Linux Redis
linux下后台启动redis
linux下后台启动redis
738 0
|
NoSQL Linux Redis
Linux系统中安装redis+redis后台启动+常见相关配置
Linux系统中安装redis+redis后台启动+常见相关配置
|
NoSQL Linux 测试技术
redis的安装步骤及前台,后台redis服务启动
这篇文章介绍了Redis的安装步骤,包括在Linux系统中下载、传输、解压、编译、安装Redis,以及Redis服务的前台和后台启动方法。
redis的安装步骤及前台,后台redis服务启动
|
NoSQL Redis 数据库
Redis 常见面试问题 Redis持久化aof后台重写和写时复制
今天有个群里网友问,redis面试被问到aof 后台重写 写时复制,我尝试回答一下
949 125
|
JavaScript NoSQL Java
CC-ADMIN后台简介一个基于 Spring Boot 2.1.3 、SpringBootMybatis plus、JWT、Shiro、Redis、Vue quasar 的前后端分离的后台管理系统
CC-ADMIN后台简介一个基于 Spring Boot 2.1.3 、SpringBootMybatis plus、JWT、Shiro、Redis、Vue quasar 的前后端分离的后台管理系统
814 0
|
存储 缓存 NoSQL
Redis性能优化问题之优化 Redis fork 耗时严重的问题,如何解决
Redis性能优化问题之优化 Redis fork 耗时严重的问题,如何解决
|
前端开发 NoSQL 应用服务中间件
谷粒学院(十四)轮播图前后台 | 整合Redis | 单点登录(一)
谷粒学院(十四)轮播图前后台 | 整合Redis | 单点登录(一)
谷粒学院(十四)轮播图前后台 | 整合Redis | 单点登录(一)
|
NoSQL Linux Redis
Linux系统Redis安装教程-附带后台启动
Linux系统Redis安装教程-附带后台启动
Linux系统Redis安装教程-附带后台启动
基于SpringBoot+Redis+Vue的后台管理系统开源项目,附源码地址
eladmin 是一款基于 Spring Boot 2.1.0 、 Jpa、 Spring Security、redis、Vue 的前后端分离的后台管理系统,项目采用分模块开发方式, 权限控制采用 RBAC,支持数据字典与数据权限管理,支持一键生成前后端代码,支持动态路由。