VUE之JWT前后端分离认证,学生管理系统

参考资料:

SpringBoot搭建教程

SpringCloud搭建教程

JWT视频教程

JWT官网

Vue视频教程

JWT视频参考资料、VUE视频资料,及前后端demo

特别有参考价值的JWT博客1

特别有参考价值的JWT博客2

cookie、localstorage和sessionStorage的区别1

cookie、localstorage和sessionStorage的区别2

cookie、localstorage和sessionStorage的区别3

VUE之基本部署及VScode常用插件

VUE之基本组成和使用

VUE之Bootstrap和Element-UI的使用

VUE之axios使用,跨域问题,拦截器添加Token

VUE之VueRouter页面跳转
 


说明:

本文只做搭建教程,相关的概念及使用方法见其他博客

项目的骨架为:Springboot + JWT + Mybatis-Plus + Mysql + VUE2


后端搭建教程:

后端项目的结构如下:

1. 数据库的创建

CREATE TABLE `student` (`id` bigint NOT NULL AUTO_INCREMENT,`number` varchar(255) NOT NULL,`name` varchar(255) NOT NULL,`age` int NOT NULL,`chi` int NOT NULL,`math` int NOT NULL,`eng` int NOT NULL,PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=146 DEFAULT CHARSET=utf8mb3
CREATE TABLE `vue_user` (`id` varchar(32) CHARACTER SET utf8 COLLATE utf8_general_ci DEFAULT NULL,`username` varchar(20) DEFAULT NULL,`password` varchar(20) DEFAULT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb3
  • 添加一些初始化语句
insert into `vue_user` (`id`, `username`, `password`) values('0DCD991FD489470E8A078F24F8C45B12','admin','123');
insert into `vue_user` (`id`, `username`, `password`) values('1B28EEC2ED4C4401ACE2D3CDE77F9E2D','try','123');
insert into `vue_user` (`id`, `username`, `password`) values('30F0B5A0DABB4CE4AF5158879F2956B7','peter','123');
insert into `vue_user` (`id`, `username`, `password`) values('3CA842FC12644A6ABED6B7CE3766C9D8','alise','123');

insert into `student` (`id`, `number`, `name`, `age`, `chi`, `math`, `eng`) values('10','110','白','17','73','72','71');
insert into `student` (`id`, `number`, `name`, `age`, `chi`, `math`, `eng`) values('11','111','小花','20','73','73','88');
insert into `student` (`id`, `number`, `name`, `age`, `chi`, `math`, `eng`) values('12','112','小新','7','59','59','59');
insert into `student` (`id`, `number`, `name`, `age`, `chi`, `math`, `eng`) values('13','113','小黄','14','78','99','93');
insert into `student` (`id`, `number`, `name`, `age`, `chi`, `math`, `eng`) values('138','2222','dsada','232323','23232','2323','2323');
insert into `student` (`id`, `number`, `name`, `age`, `chi`, `math`, `eng`) values('139','333','佩特瑞','22','2','2','2');
insert into `student` (`id`, `number`, `name`, `age`, `chi`, `math`, `eng`) values('140','2323','wwww','232','23','23','23');
insert into `student` (`id`, `number`, `name`, `age`, `chi`, `math`, `eng`) values('141','888','eee','33','3','3','3');
insert into `student` (`id`, `number`, `name`, `age`, `chi`, `math`, `eng`) values('142','666','ww','5','5','5','5');
insert into `student` (`id`, `number`, `name`, `age`, `chi`, `math`, `eng`) values('143','666','ww','5','5','5','5');
insert into `student` (`id`, `number`, `name`, `age`, `chi`, `math`, `eng`) values('144','99','qq','55','55','55','55');
insert into `student` (`id`, `number`, `name`, `age`, `chi`, `math`, `eng`) values('145','666','oo','66','66','2','6');

2.创建SpringBoot项目或者SpringCloud项目

  • 这里不做详细阐述,具体参照SpringBoot项目搭建或者SpringCloud项目搭建

3.使用Mybatis-Plus进行项目连接

  • 这里不做详细阐述,具体参照SpringBoot整合Mybatis-Plus
  • 依赖:
        <dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-boot-starter</artifactId><version>3.5.1</version></dependency>
  • 搭配的实体为

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

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

相关文章

Metamask登录方式集成

Metamask登录 https://www.toptal.com/ethereum/one-click-login-flows-a-metamask-tutorial#how-the-login-flow-works 参考&#xff1a; https://zh.socialgekon.com/one-click-login-with-blockchain 后端需要在用户表中增加address和nonce字段。兼容其他登录方式&#xff0…

【分布式技术专题】RocketMQ延迟消息实现原理和源码分析

痛点背景 业务场景 假设有这么一个需求&#xff0c;用户下单后如果30分钟未支付&#xff0c;则该订单需要被关闭。你会怎么做&#xff1f; 之前方案 最简单的做法&#xff0c;可以服务端启动个定时器&#xff0c;隔个几秒扫描数据库中待支付的订单&#xff0c;如果(当前时间-订…

国产芯力特SIT1024QHG四通道本地互联网络(LIN)收发器,可替代TJA1024HG

SIT1024Q 是一款四通道本地互联网络&#xff08;LIN&#xff09;物理层收发器&#xff0c;符合 LIN 2.0、LIN 2.1、LIN 2.2、 LIN 2.2A 、 ISO 17987-4:2016 (12V) 和 SAE J2602 标准。主要适用于使用 1kbps 至 20kbps 传输速 率的车载网络。 SIT1024Q 通过 TXDx 引…

【0805作业】Linux中 AB终端通过两根有名管道进行通信聊天(半双工)(全双工)

作业一&#xff1a;打开两个终端&#xff0c;要求实现AB进程对话【两根管道】 打开两个终端&#xff0c;要求实现AB进程对话 A进程先发送一句话给B进程&#xff0c;B进程接收后打印B进程再回复一句话给A进程&#xff0c;A进程接收后打印重复1.2步骤&#xff0c;当收到quit后&am…

桥接模式-java实现

桥接模式 桥接模式的本质&#xff0c;是解决一个基类&#xff0c;存在多个扩展维度的的问题。 比如一个图形基类&#xff0c;从颜色方面扩展和从形状上扩展&#xff0c;我们都需要这两个维度进行扩展&#xff0c;这就意味着&#xff0c;我们需要创建一个图形子类的同时&#x…

【MMU】认识 MMU 及内存映射的流程

MMU&#xff08;Memory Manager Unit&#xff09;&#xff0c;是内存管理单元&#xff0c;负责将虚拟地址转换成物理地址。除此之外&#xff0c;MMU 实现了内存保护&#xff0c;进程无法直接访问物理内存&#xff0c;防止内存数据被随意篡改。 目录 一、内存管理体系结构 1、…

内网穿透:实现公网访问内网群晖NAS的方法

公网远程访问内网群晖NAS 7.X版 【内网穿透】 文章目录 公网远程访问内网群晖NAS 7.X版 【内网穿透】前言1. 在群晖控制面板找到“终端机和SNMP”2. 建立一条连接公网数据隧道3. 获取公网访问内网群晖NAS的数据隧道入口 前言 群晖NAS作为应用较为广泛的小型数据存储中心&#…

SQL92 SQL99 语法 Oracle 、SQL Server 、MySQL 多表连接、Natural 、USING

SQL92 VS SQL 99 语法 92语法 内连接 from table1&#xff0c; table2 where table1.col table2.col 外连接 放在 从表 左连接&#xff1a; from table1&#xff0c; table2 where table1.col table2.col() 右连接&#xff1a; from table1&#xff0c; table2 where table…

自定义注解(Annontation)

目录 1.注解定义 2.元注解定义 3. 自定义注解&#xff08;自定义的注解名称相同的会覆盖原注解&#xff09; 4.Annotation架构&#xff08;元注解参数介绍&#xff09; 1.注解定义 注解是用来将任何的信息或元数据&#xff08;metadata&#xff09;与程序元素&#xff08;类…

苍穹外卖项目解读(四) 微信小程序支付、定时任务、WebSocket

前言 HM新出springboot入门项目《苍穹外卖》&#xff0c;笔者打算写一个系列学习笔记&#xff0c;“苍穹外卖项目解读”&#xff0c;内容主要从HM课程&#xff0c;自己实践&#xff0c;以及踩坑填坑出发&#xff0c;以技术&#xff0c;经验为主&#xff0c;记录学习&#xff0…

深度学习基础知识扫盲

深度学习 监督学习&#xff08;Supervised learning&#xff09;监督学习分类 无监督学习&#xff08;Non-supervised learning&#xff09;无监督学习的算法无监督学习使用场景 术语特征值特征向量特征工程&#xff08;Feature engineering&#xff09;特征缩放Sigmod functio…

大学生创业运营校园跑腿小程序怎么样?

校园跑腿小程序是一种基于移动互联网的服务平台&#xff0c;旨在为大学生提供便捷的跑腿服务。它可以连接大学生用户和需要代办事务的人群&#xff0c;实现多方共赢的局面。接下来&#xff0c;我将从需求背景、市场前景、功能特点等方面进行分析。 首先&#xff0c;校园跑腿小程…

使用mybatis-plus的updateById方法更新一个numeric(1)类型字段,sql成功执行,但是updates为0,更新失败的解决办法

使用mybatis-plus的updateById方法更新一个numeric(1)类型字段&#xff0c;sql成功执行&#xff0c;但是updates为0&#xff0c;更新失败的解决办法&#xff1a; 背景&#xff1a;我有一张表&#xff0c;有个启用禁用功能&#xff0c;没有放在编辑页面一起编辑保存&#xff0c;…

最强自动化测试框架Playwright-操作指南(3)-PO模式

playwright支持PO模式 创建页面对象 class SearchPage:def __init__(self, page):self.page pageself.search_term_input page.get_by_role("searchbox", name"输入搜索词")def navigate(self):self.page.goto("https://bing.com")def searc…

MySQL5.7数据库、Navicat Premium1.6可视化工具安装教程【详细教程】

文章目录 一、MySQL、Navicat、注册机地址二、安装&#xff08;一&#xff09;、MySQL安装&#xff08;二&#xff09;、Navicat Premium安装&#xff08;三&#xff09;、集活Navicat Premium 三、遇到的问题1、Are you sure your navicat has not beenpatched/modified befor…

【高频面试题】微服务篇

文章目录 Spring Cloud1.Spring Cloud 5大组件有哪些&#xff1f;2.服务注册和发现是什么意思&#xff1f;Spring Cloud 如何实现服务注册发现&#xff1f;3.负载均衡如何实现的 ?4.什么是服务雪崩&#xff0c;怎么解决这个问题&#xff1f;5.微服务是怎么监控的 业务相关6.项…

Nginx安装以及LVS-DR集群搭建

Nginx安装 1.环境准备 yum insatall -y make gcc gcc-c pcre-devel #pcre-devel -- pcre库 #安装openssl-devel yum install -y openssl-devel 2.tar安装包 3.解压软件包并创建软连接 tar -xf nginx-1.22.0.tar.gz -C /usr/local/ ln -s /usr/local/nginx-1.22.0/ /usr/local…

数组对象去重的几种方法

场景&#xff1a; let arrObj [{ name: "小红", id: 1 },{ name: "小橙", id: 1 },{ name: "小黄", id: 4 },{ name: "小绿", id: 3 },{ name: "小青", id: 1 },{ name: "小蓝", id: 4 } ]; 方法一&#xff1a;…

【React学习】—函数式组件(四)

【React学习】—函数式组件&#xff08;四&#xff09; <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8" /><meta name"viewport" content"widthdevice-width, initial-scale1.0" /><ti…

HECI-Securtiy 防火墙路由技术

目录 一、防火墙路由基本原理 1.路由分类 2.路由优先级 3.路由查询先后顺序 4.静态路由基本原理 &#xff08;1&#xff09;指定出接口场景 &#xff08;2&#xff09;指定下一跳地址场景 5.静态路由与多出口 &#xff08;1&#xff09;主备备份 &#xff08;2&#…