springboot+vue结合redis实现登录拦截

已于 2023-09-18 11:13:35 修改
阅读量321 收藏 3
点赞数 4
文章标签： spring boot vue.js
于 2023-09-18 11:06:54 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Co_oll/article/details/132967012
版权

springboot+vue结合redis实现登录拦截

1.后端代码

1.1pom.xml依赖

redis依赖

		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-data-redis</artifactId>
		</dependency>

mysql依赖

		<dependency>
			<groupId>mysql</groupId>
			<artifactId>mysql-connector-java</artifactId>
			<version>8.0.33</version>
		</dependency>

jwt依赖

		<dependency>
			<groupId>com.auth0</groupId>
			<artifactId>java-jwt</artifactId>
			<version>3.8.3</version>
		</dependency>

完整pom.xml依赖

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
	<modelVersion>4.0.0</modelVersion>
	<parent>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-parent</artifactId>
		<version>2.7.15</version>
		<relativePath/> <!-- lookup parent from repository -->
	</parent>
	<groupId>com.example</groupId>
	<artifactId>vuesb</artifactId>
	<version>0.0.1-SNAPSHOT</version>
	<name>vuesb</name>
	<description>vuesb</description>
	<properties>
		<java.version>1.8</java.version>
	</properties>
	<dependencies>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-web</artifactId>
		</dependency>
		<dependency>
			<groupId>com.auth0</groupId>
			<artifactId>java-jwt</artifactId>
			<version>3.8.3</version>
		</dependency>

		<dependency>
			<groupId>mysql</groupId>
			<artifactId>mysql-connector-java</artifactId>
			<version>8.0.33</version>
		</dependency>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-data-redis</artifactId>
		</dependency>
	</dependencies>

	<build>
		<plugins>
			<plugin>
				<groupId>org.springframework.boot</groupId>
				<artifactId>spring-boot-maven-plugin</artifactId>
			</plugin>
		</plugins>
	</build>

</project>

1.2后端jwt拦截器

1.2.1 Interceptor拦截器配置(入口拦截）

因为我前端的url为本机8080端口，所以在allowedOrigins这里我把允许的跨域请求设置为了我的前端端口，这里也可以写为

registry.addMapping("/**")
                .allowedOrigins("*")
                .allowCredentials(true)
                .allowedMethods("GET", "POST", "DELETE", "PUT", "PATCH", "OPTIONS", "HEAD")
                .maxAge(3600 * 24);

package com.example.vuesb.jwt;

import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

import java.util.ArrayList;

public class InterceptorConfig implements WebMvcConfigurer {
    TokenInterceptor tokenInterceptor;
    public InterceptorConfig(TokenInterceptor tokenInterceptor){//构造函数
            this.tokenInterceptor=tokenInterceptor;
        }
        @Override
        public void addInterceptors(InterceptorRegistry registry){//配置拦截器
            ArrayList<String>excludePath=new ArrayList<>();
            excludePath.add("/login");//登录
            excludePath.add("/logout");//登出
            excludePath.add("/register");//注册
            registry.addInterceptor(tokenInterceptor)//注册拦截器
                    .addPathPatterns("/**")//拦截所有请求
                    .excludePathPatterns(excludePath);//添加拦截白名单
            WebMvcConfigurer.super.addInterceptors(registry);//调用父接口
    }
    @Override
    public void addCorsMappings(CorsRegistry registry){
        registry.addMapping("/**")
                .allowCredentials(true)//允许携带cookie
                .allowedMethods("GET", "POST", "DELETE", "PUT", "PATCH", "OPTIONS", "HEAD")//允许访问的方法
                .allowedOrigins("http://localhost:8080")//允许的跨域访问地址
                .maxAge(3600*24);//options缓存时间
    }
}

1.2.2 JWTUtil

这里的verify方法没什么用，是我在用redis之前写的，可以不加

package com.example.vuesb.jwt;

import com.auth0.jwt.JWT;
import com.auth0.jwt.JWTVerifier;
import com.auth0.jwt.algorithms.Algorithm;
import com.auth0.jwt.interfaces.DecodedJWT;

import java.util.Date;


public class JWTUtil {
    private static final long EXPIRE_TIME = 60 * 60 * 1000;
    private static final String tokenPassword = "uziCjb";

    public static String sign(String username) {//用用户名作为被加密的对象
        String token;
        Date expireTime = new Date(System.currentTimeMillis() + EXPIRE_TIME);//过期时间
        token = JWT.create()//生成jwt令牌，加密过程
                .withIssuer("llh")
                .withClaim("username", username)
                .withExpiresAt(expireTime)
                .sign(Algorithm.HMAC256(tokenPassword));
        return token;//返回加密后的token
    }
    public static boolean verify(String token){
        JWTVerifier jwtVerifier=JWT.require(Algorithm.HMAC256(tokenPassword)).withIssuer("llh").build();//构建一个jwt解码器
        DecodedJWT jwtToken=jwtVerifier.verify(token);//解码
        if(token.isEmpty()){//若token为空则返回false拦截
            return false;
        }
        else {
            System.out.println("认证通过：");
            System.out.println("issuer: " + jwtToken.getIssuer());
            System.out.println("username: " + jwtToken.getClaim("username").asString());
            System.out.println("过期时间：      " + jwtToken.getExpiresAt());
            return true;
        }
    }
}

1.2.3TokenInterceptor（token拦截器）

注册服务那里一定要写!!!

package com.example.vuesb.jwt;

import com.example.vuesb.redis.RedisUtil;
import org.springframework.web.servlet.HandlerInterceptor;

import javax.annotation.Resource;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;


public class TokenInterceptor implements HandlerInterceptor {
    @Resource
    RedisUtil redisUtil;//注册服务

    @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) {
        String token = request.getHeader("token");
        try {
            if (request.getMethod().equals("OPTIONS")) {//检查是否为跨域请求
                if (token != null) {
                    if (redisUtil.getTokens(token) != null) {
                        response.setStatus(200);//设置状态码为正常
                        return true;
                    } else {
                        response.setStatus(401);//设置状态码为未通过登录验证
                        return false;
                    }
                } else {
                    response.setStatus(401);//设置状态码为未通过登录验证
                    return false;

                }
            }
        } catch (Exception e) {
            response.setStatus(500);
            throw new RuntimeException();
        }
        response.setCharacterEncoding("utf-8");
        try {
            if (token != null) {
                if (redisUtil.getTokens(token) != null) {
                    response.setStatus(200);//设置状态码为正常，即通过登录验证
                    System.out.println("通过拦截器");
                    return true;
                } else {
                    response.setStatus(401);
                    return false;
                }
            } else {
                response.setStatus(401);
                return false;
            }
        } catch (Exception exception) {
            response.setStatus(500);//发生了不可预测的错误
            throw new RuntimeException();
        }


    }
}

1.3redis配置

RedisUtil

package com.example.vuesb.redis;


import org.springframework.data.redis.core.RedisTemplate;
import org.springframework.data.redis.core.ValueOperations;
import org.springframework.stereotype.Service;
import javax.annotation.Resource;
import java.util.concurrent.TimeUnit;


@Service
public class RedisUtil {
    @Resource
    private RedisTemplate<String, String> stringRedisTemplate;//这是一个使用redis的API，可以直接用StringRedisTemplate
    
    public void addTokens(String username, String token) {//存入token
        if (username != null && token != null) {
            System.out.println("参数不为空");
            System.out.println(username);
            System.out.println(token);
            ValueOperations valueOperations = stringRedisTemplate.opsForValue();
            valueOperations.set(username, token, 60, TimeUnit.MINUTES);//设置token过期时间为一小时

        } else {
            System.out.println("参数为空");
        }
    }

    public String getTokens(String username) {//获取token
        return stringRedisTemplate.opsForValue().get(username);
    }

    public void delTokens(String username) {//删除token
        stringRedisTemplate.delete(username);
    }

}

1.4登录接口

数据库这里我是用的原生jdbc

package com.example.vuesb;

import JDBC.VueLogin;
import com.example.vuesb.jwt.JWTUtil;
import com.example.vuesb.redis.RedisUtil;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;

import javax.annotation.Resource;
import java.sql.ResultSet;
import java.sql.SQLException;

@CrossOrigin
@RestController
public class demo {
    @Resource
    RedisUtil redisUtil;
    @RequestMapping("/login")
    public String loginCheck(@RequestParam("username") String username, @RequestParam("password") String password) throws SQLException {
        String returnStr="No";
        ResultSet resultSet;
        resultSet=new VueLogin().seekAccount(username);
        String sqlPass = null;
        if(resultSet.next()){
            sqlPass=resultSet.getString(1);
            if (sqlPass.equals(password)){
                String token = new JWTUtil().sign(username);

                redisUtil.addTokens(username,token);
                returnStr=token;
            }
        }

        return returnStr;
    }
    @RequestMapping("/register")
    public String register(@RequestParam("username") String username,@RequestParam("password") String password){
        String returnStr="123";
        ResultSet resultSet=new VueLogin().seekAccount(username);
        try {
            if (!resultSet.next()){
                new VueLogin().addRegister(username, password);
                returnStr="OK";
            }
            else {
                returnStr="No";
            }
        } catch (SQLException e) {
            System.out.println("注册失败");
            throw new RuntimeException(e);
        }
        return  returnStr;
    }
}

1.5mysql

package JDBC;

import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;

public class VueLogin {
    public void addRegister(String username ,String password){
        String sql="insert into vuelogin(username,password)values(?,?)";
        PreparedStatement preparedStatement;
        try {
            preparedStatement=Conn.getConnection().prepareStatement(sql);
            preparedStatement.setString(1,username);
            preparedStatement.setString(2,password);
            preparedStatement.executeUpdate();
            preparedStatement.close();
        } catch (SQLException e) {
            System.out.println("注册失败");
            throw new RuntimeException(e);

        }
    }
    public ResultSet seekAccount(String account){
        String sql="select password from vuelogin where username=?";
        PreparedStatement preparedStatement;
        ResultSet resultSet;
        try {

            preparedStatement= Conn.getConnection().prepareStatement(sql);
            preparedStatement.setString(1,account);
            resultSet=preparedStatement.executeQuery();

            return resultSet;
        } catch (SQLException e) {
            System.out.println("查询失败");
            throw new RuntimeException(e);
        }
    }
}

2.前端代码

2.1 main.js

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import './plugins/element.js'
import './router/permission'
import axiosInstance from './store/request.js'
import axios from 'axios'
Vue.prototype.$http = axios
Vue.config.productionTip = false
// axiosInstance.defaults.baseURL = 'http://localhost:8081'; // 后端端口为8081

new Vue({
  router,
  store,
  axiosInstance,
  render: h => h(App)
}).$mount('#app')

2.2store/index.js(记得安装vuex)

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    token:localStorage.getItem('token')?localStorage.getItem('token'):''
  },
  getters: {
  },
  mutations: {
    setToken(state,token){
      state.token=token
      localStorage.setItem("token",token.token)//存储token
    },
    delToken(state){
      state.token=''
      localStorage.removeItem("token")//删除token
      
    }
  },
  actions: {
  },
  modules: {
  }
})

2.3路由配置router下index.js

import Vue from 'vue'
import VueRouter from 'vue-router'
import HomeView from '../views/HomeView.vue'
import LayoutView from "../views/LayoutView.vue"
Vue.use(VueRouter)

const routes = [
{
  path:"/",
  name:"LayoutView",
  component:LayoutView,
  children:[
    {
      path: '',
      name: 'home',
      component: HomeView,
      meta:{
        isLogin:true
      }
    },
    {
      path:"params",
      name:"paramsview",
      component:()=>import("../views/main/ParamsView.vue"),
      meta:{
        isLogin:true
      }
    },
    {
      path:"product",
      name:"ProductView",
      component:()=>import("../views/main/ProductView.vue"),
      meta:{
        isLogin:true
      }
    },
    {
      path:"ad",
      name:"ADCategoryview",
      component:()=>import("../views/main/ADCategoryView.vue"),
      meta:{
        isLogin:true
      }
    }
  ]
},
{
  path:"/login",
  name:"LoginView",
  component:()=>import("../views/LoginView.vue")
}
  
  
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

export default router

2.4permission路由守护

import router from "./index";
//路由守护
router.beforeEach((to,from,next)=>{
    if(to.meta.isLogin){
        if(to.path==='/login'){
            next()
        }
        else{
            const tokenStr=window.localStorage.getItem('token')
            if(!tokenStr){
                return next('/login')
            }
            else{
                next()
            }
        }
    }
    else{
        next();
    }
})

 2.5设置新的全局axios

在这里需要设置一个新的全局axios，这样可以在每一个ajax请求发出之前将token加入到请求头中

import axios from "axios";


//创建axios实例
const axiosInstance = axios.create({
    baseURL: 'http://localhost:8081', // 设置默认发送地址为后端端口
    });

//添加拦截器，在每次ajax之前都会执行这个操作
axiosInstance.interceptors.request.use(function (config){
    console.log("操作了")
    //从本地缓存获得token
    const token=window.localStorage.getItem('token')
    
    //如果存在将其加入请求头中
    if(token){
        console.log(token)
        config.headers.token = token;
    }
    return config;
},function (error){
    return Promise.reject(error);//发生错误返回一个拒绝的promise对象
})

export default axiosInstance;

2.6loginView(登录业务)

上半部分是elementUI，可以省略

<template>
  <div class="login">
    <el-card class="box-card">
    <div slot="header" class="clearfix">
      <span>人工智能大数据实验室</span>

    
    </div>
    <el-tabs v-model="currentIndex" stretch @tab-click="handleClick">
      <el-tab-pane label="登录" name="login">
        <el-form :model="loginForm" :rules="rules" status-icon ref="loginForm">
          <el-form-item label="用户名" label-width="80px" prop="username">
              <el-input type="text" v-model="loginForm.username"></el-input>
          </el-form-item>
          <el-form-item label="密码" label-width="80px" prop="password">
              <el-input type="password" v-model="loginForm.password"></el-input>
          </el-form-item>
          <el-form-item >
            <el-button type="primary" @click="submitForm('loginForm')">登录</el-button>
          </el-form-item>
        </el-form>
      </el-tab-pane> 

      <el-tab-pane label="注册" name="register">
        
        <el-form :model="registerForm" :rules="rules" status-icon ref="registerForm">

          <el-form-item label="用户名" label-width="80px" prop="username">
              <el-input type="text" v-model="registerForm.username"></el-input>
          </el-form-item>

          <el-form-item label="密码" label-width="80px" prop="password">
              <el-input type="password" v-model="registerForm.password"></el-input>
          </el-form-item>

          <el-form-item label="确认密码" label-width="80px" prop="checkPassword">
              <el-input type="password" v-model="registerForm.checkPassword"></el-input>
          </el-form-item>

          <el-form-item >
            <el-button type="primary" @click="submitForm('registerForm')">注册</el-button>
          </el-form-item>
        </el-form>
      </el-tab-pane>  
    </el-tabs>
  </el-card>
  </div>
</template>

<script>
import axios from 'axios';
import axiosInstance from '@/store/request';
export default {
  data(){
    var validateUsername= (rule,value,callback) =>{
      if(!value){
        return callback(new Error('请输入账号'))
      }
      else if(value.length<3){
        return callback(new Error('请输入3位以上的账号'))
      }
      else {
        callback();
      }
    }

    var validatePassword=(rule,value,callback) =>{
        if(this.activeTab==="login"){
          if(!value){
        return callback(new Error("请输入密码"))
        }
        else{
          callback();
        }
      }
      if(this.activeTab==="register"){
        if(!value){
        return callback(new Error("请输入密码"))
      }
      else if(value.length<6){
        callback(new Error("请输入六位以上的密码"))
      }
      else if(value.length>16){
        callback(new Error("请输入16位以下的密码"))
      }
      else{
        callback();
      }
        }
      }
    var validateRegisterCheckPassword=(rule,value,callback) =>{
      if(!value){
        return callback(new Error("请再次输入密码"))
      }
      else if(this.registerForm.password!==value){
      
        return callback(new Error("两次密码输入不一致"))
      }
      else {
        return callback()
      }
    }
      return {
        currentIndex:"login",
        loginForm:{
            username:"",
            password:""
        },
        registerForm:{
            username:"",
            password:"",
            checkPassword:"",
        },
        activeTab:"login",
        rules:{
            username:[{
              validator:validateUsername,trigger:'blur'
            }],
            password:[{
              validator:validatePassword,trigger:'blur'
            }],
            checkPassword:[{
              validator:validateRegisterCheckPassword,trigger:'blur'
            }],
        }
      }
  },
 
  methods:{
    submitForm(formname){
      const that=this
        this.$refs[formname].validate((valid)=>{
            if(valid){
              if(this.activeTab==="login"){
                console.log(this.loginForm.username)
                console.log(this.loginForm.password)

                    axiosInstance.get('/login',{
                    params:{
                      username:this.loginForm.username,
                      password:this.loginForm.password,
                      
                    }
                }).then(function (response){
                  if(response.data!=='No'){
                    that.$store.commit('setToken',response.data)
                    that.$router.push({path:'/product'})
                  }
                  else{
                    alert("账号密码错误")
                  }
                })
                
                
                // console.log(this.username+"pass"+this.password);
              }
              if(this.activeTab==="register"){

                axios.get('/register',{
                  params:{
                    username:this.registerForm.username,
                    password:this.registerForm.password,
                  }
                }).then(function (response){
                  if(response.data==='OK'){
                    alert("注册成功")
                  }
                  else if(response.data==='No'){
                    alert("账号已存在")
                  }
                  else{
                    alert("注册失败")
                  }
                })

                console.log(this.registerForm)
          }
        }
            else{
              console.log("abc")
              return;
            }
        })
    },
    handleClick(tab){
      this.activeTab=tab.name
      // console.log("active"+this.activeTab)
      // console.log("tab"+tab.name)

    }
  }
}
</script>

<style>
  
  .login{
    width: 1200px;
    margin: 0 auto;
    text-align: center;
  }
  .box-card{
    width: 500px;
    margin: 100px auto;
  }
</style>

3.成果展示

可以在请求头里看到加上了一个token

Cool10969
关注
基于SpringBoot+Vue+Redis实现的前后端分离学生宿舍管理系统
weixin_itchengxulaoyuan
10-22 2176
背景分析 随着互联网快速发展，电脑的发展，让我们的生活更加的便利，也在学校的办公管理领域得到了很好发挥，以前记录学生宿舍操作需要通过人工记录的方式，来登记，这样的操作极其不方便，尤其是在查阅某个人员进出时的情况，需要查看过多的人员信息，这对工作造成了极不方便，所以开发一套学生宿舍管理系统，就可以很好的解决这一难题。 通过使用学生宿舍管理系统不仅可以降低人工成本，而且在管理上也可以得到很好的提升。以前在宿舍记录管理中，最容易出错的环节，就是登陆人员的进出情况，而该系统软件的出现，可让更多的时间花在如..
Springboot+vue+redis实现一个账户只能在一处登录
xiaoxiao1927的博客
11-25 2533
Springboot+vue+redis实现一个账户只能在一处登录（类似QQ）
SpringBoot+Vue+Redis实现单点登录(一处登录另一处退出登录)
08-25
小编接到一个需求，需要实现用户在浏览器登录后，跳转到其他页面，当用户在其它地方又登录时，前面用户登录的页面退出登录，这篇文章主要介绍了SpringBoot+Vue+Redis实现单点登录,需要的朋友可以参考下
【SpringBoot+Vue】前后端分离项目之JWT登录拦截
m0_65563175的博客
12-08 1442
1、服务器生成一个Json格式的Token给客服端保存到浏览器当中，这里我采用的是localStorage当地存储而不是sessionStorage会话存储。这里的区别就是sessionStorage是当浏览器关闭就会删除其存储的token。2、当每次访问一个页面（也可以说是调用前端接口方法）时就会向服务器传回去token进行校验，如果不是刚开始存储的token又或者是过期的token，那么我直接返回到登录页面。所以才有了登录拦截的思想，但凡没有登录过的就需要拦截下来。又称Json Web Token。
Vue.js 应用结合 Redis 数据库：实践与优化
最新发布
cnzzs的博客
07-18 478
引言Vue.js 是一个用于构建用户界面的渐进式框架，而 Redis 是一个开源的键值存储系统，以其高性能和低延迟著称。将 Vue.js 与 Redis 结合使用，可以创建出响应迅速、数据实时性强的现代 Web 应用。本文将探讨如何在 Vue.js 应用中集成 Redis，以实现数据缓存、状态管理和实时通信等功能。环境准备...
Vue + Spring Boot 项目实战（六）：前端路由与登录拦截器
热门推荐
Evan 的博客
04-25 11万+
前端路由的基本原理、使用 history 路由模式时后端登录拦截器的配置、Vuex 的引入以及前端拦截器的实现。
SpringBoot+Vue+Jpa+Redis实现单点登录(一处登录，另一处退出登录)
JAVA-XH
11-25 4562
SpringBoot+Vue+Redis实现单点登录(一处登录，另一处退出登录) 一、需求 实现用户在浏览器登录后，跳转到其他页面，当用户在其它地方又登录时，前面用户登录的页面退出登录(列如qq挤号那种方式) 二、实现思路 用户在前端填写用户信息登录后，后台接收数据先去数据库进行判断，如果登录成功，创建map集合，以用户id为键，token为值，先通过当前登录用户的id去获取token，如果tok...
springboot+vue结合，后端学习前端（三）（前端拦截器+后端拦截器）未登录访问其他页面，直接进入登陆界面
m0_54765221的博客
02-25 3377
处理#号问题，前端拦截器应用于前后分离项目，后端拦截器应用于合并的项目
SpringBoot+Shiro+JWT+Jedis+MybatisPlus+前后端分离+基于url通用权限管理系统
01-25
总的来说，这个系统通过SpringBoot构建基础框架，利用Shiro进行权限控制，结合JWT实现无状态认证，借助Jedis提升性能，运用MybatisPlus简化数据库操作，实现了基于URL的权限管理。这种设计不仅提高了系统的安全性，...
基于SpringBoot+Redis+Vue的后台管理系统开源项目，附源码地址
m0_63437643的博客
11-22 740
eladmin 是一款基于 Spring Boot 2.1.0 、 Jpa、 Spring Security、redis、Vue 的前后端分离的后台管理系统，项目采用分模块开发方式， 权限控制采用 RBAC，支持数据字典与数据权限管理，支持一键生成前后端代码，支持动态路由。
SpringBoot+vue全栈开发实战笔记太香了
ZzzzjQqqq的博客
05-31 2023
Spring 作为一个轻量级的容器，在JavaEE开发中得到了广泛的应用，但是Spring 的配置繁琐臃肿，在和各种第三方框架进行整合时代码量都非常大，并且整合的代码大多是重复的，为了使开发者能够快速上手Spring，利用Spring框架快速搭建JavaEE项目，Spring Boot应运而生。 Spring Boot 中对一些常用的第三方库提供了默认的自动化配置方案，使得开发者只需要很少的Spring 配置就能运行一个完整的Java EE应用。Spring Boot项目可以采用传统的方案打成war包,然
SpringBoot拦截器实现登录拦截的方法示例
08-25
主要介绍了SpringBoot拦截器实现登录拦截的方法示例，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
SpringBoot+MyBatis+SpringSession+Redis实现session共享及单点登录
03-02
SpringBoot+MyBatis+SpringSession+Redis实现session共享及单点登录开发实例
vue-基于springboot+vue+redis实现的前后端分离员工管理系统
10-22
vue-基于springboot+vue+redis实现的前后端分离员工管理系统，在springboot基础上，实现前后端分离，同时涉及Redis（NoSql数据库），解决业务缓存问题
springboot+redis+token保持登录
08-03
通过redis 设置session过期时间，实现token 登录机制
项目基于SpringBootRedisVue的前后端分离后台管理系统
08-07
项目基于 Spring Boot 2.1.0 、 Spring Boot Jpa、 Spring Security、Redis、Vue的前后端分离后台管理系统， 权限控制采用 RBAC，前端菜单动态路由
vue+springboot+redis单点登录
weixin_44890979的博客
05-16 576
1.搭建springboot环境 <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <dependency> <
SpringBoot Vue集成 Jwt 配置拦截器 登录
ZhanHanson的博客
10-05 743
SpringBoot Vue集成 Jwt 配置拦截器 登录
SprigBoot + JWT + Redis 实现单点登录思路
03-21 1849
最近一直在纠结低配版的单点登录. 用于小型项目开发. 直奔主题: 1. Token生成思路 = md5(当日日期(yyyyMMdd) + id) + 4位随机 2. 每次登录删除Redis里面的前缀为md5(当日日期(yyyyMMdd) + id)的token , 然后放入新增的token 这里要用到Redis的 keys 命令 由于Redis的单线程服务模式，命令keys会阻塞正常的业...
springboot+vue+redis+mysql的后台管理系统如何部署
05-17
部署一个基于SpringBoot + Vue + Redis + MySQL的后台管理系统，需要以下步骤： 1. 首先在服务器上安装Java环境、Node.js环境、Redis和MySQL数据库，并进行配置。 2. 将项目代码上传到服务器，可以使用FTP或者git clone命令将代码拉取到服务器。 3. 在服务器上使用Maven对SpringBoot项目进行打包，生成jar包。 4. 在服务器上使用npm对Vue项目进行打包，生成静态资源文件。 5. 在MySQL数据库中创建数据库和表，并将初始数据插入到表中。 6. 配置SpringBoot项目的application.properties或application.yml文件，包括数据源、Redis、端口等相关配置。 7. 启动Redis服务和MySQL服务。 8. 使用命令行运行SpringBoot项目的jar包，例如：java -jar xxx.jar。 9. 使用Nginx配置反向代理，将Vue项目的静态资源文件和SpringBoot项目的API接口进行映射。 10. 在浏览器中输入服务器IP地址和端口号，访问系统。 以上就是基于SpringBoot + Vue + Redis + MySQL的后台管理系统的部署步骤。需要注意的是，部署过程中可能还会遇到其他问题，需要根据具体情况进行解决。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值