springboot+springsecurity+jwt+elementui图书管理系统Java大师

请输入表名，多个英文逗号分割：t_user,t_menu,t_role,t_user_role,t_role_menu

1）

认证管理

流程图解读：

1、用户提交用户名、密码被SecurityFilterChain中的UsernamePasswordAuthenticationFilter过滤器获取到，封装为请求Authentication，通常情况下是UsernamePasswordAuthenticationToken这个实现类。

2、然后过滤器将Authentication提交至认证管理器（AuthenticationManager）进行认证。

3、认证成功后，AuthenticationManager身份管理器返回一个被填充满了信息的（包括上面提到的权限信息，身份信息，细节信息，但密码通常会被移除）Authentication实例。

Jwttoken由Header、Payload、Signature三部分组成，这三部分之间以小数点”.”连接，JWTtoken长这样：

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.keH6T3x1z7mmhKL1T3r9sQdAxxdzB6siemGMr_6ZOwU

token解析后长这样：header部分，有令牌的类型(JWT)和签名算法名称(HS256)：{"alg":"HS256","typ":"JWT"}Payload部分，有效负载，这部分可以放任何你想放的数据：

{"sub":"1234567890","name":"JohnDoe","iat":1516239022}

Signature签名部分，由于这部分是使用header和payload部分计算的，所以还可以以此来验证payload部分有没有被篡改：

HMACSHA256(

base64UrlEncode(header)+"."+

base64UrlEncode(payload),

123456//这里是密钥，只要够复杂，一般不会被破解

)

@EnableGlobalMethodSecurity(prePostEnabled=true)@SpringBootApplication@MapperScan("com.ds.book.mapper")publicclassBookSysApplication{publicstaticvoidmain(String[]args){SpringApplication.run(BookSysApplication.class,args);}}2）Controller方法上添加@PreAuthorize注解

@ComponentpublicclassMyAccessDecisionManagerimplementsAccessDecisionManager{//1、认证通过后，会往authentication中填充用户信息//2、拿authentication中的权限与上一步获取到的角色信息进行比对，比对成功后，允许访问@Overridepublicvoiddecide(Authenticationauthentication,Objectobject,CollectionconfigAttributes)throwsAccessDeniedException,InsufficientAuthenticationException{Collectionauthorities=authentication.getAuthorities();for(ConfigAttributeconfigAttribute:configAttributes){for(GrantedAuthorityauthority:authorities){if(authority.getAuthority().equals(configAttribute.getAttribute())){return;}}}thrownewAccessDeniedException("权限不足，请联系管理员");}@Overridepublicbooleansupports(ConfigAttributeattribute){returnfalse;}@Overridepublicbooleansupports(Class<>clazz){returnfalse;}}3）在SecurityConfig中，添加后置处理器（增强器），让springsecurity使用我们自己的datametasource和decisionMananger

io.springfoxspringfox-swagger22.7.0io.springfoxspringfox-swagger-ui2.7.0com.github.xiaoyminknife4j-spring-boot-starter2.0.72）创建swagger配置文件

//主要的配置文件，antMatchers匹配的路径，全部忽略，不进行JwtToken的认证@Overridepublicvoidconfigure(WebSecurityweb)throwsException{web.ignoring().antMatchers("/login","/logout","/css/**","/js/**","/index.html","favicon.ico","/doc.html","/webjars/**","/swagger-resources/**","/v2/api-docs/**");}4）编写LoginController接口，通过@Api和@ApiOperation注解使用swagger

测试成功！

注意：前后端分离项目，退出的时候，由前端清除浏览器请求header中的token和sessionStorage或者LocalStorage，后端只要返回一个退出成功的消息。

执行绿色的命令，出现下列界面代表脚手架创建项目成功2、整合elementui//命令行安装npmielement-ui-S//main.js使用element-uiimportVuefrom'vue';importElementUIfrom'element-ui';import'element-ui/lib/theme-chalk/index.css';importAppfrom'./App.vue';Vue.use(ElementUI);newVue({el:'#app',render:h=>h(App)});3、安装vue-router2.1安装依赖

npminstallvue-router@32.2创建路由文件

npminstall-gjson-server4.2创建mock文件夹，新建db.json

"mock":"json-serversrc/mock/db.json--port3000--middlewaressrc/mock/middlewares.js"4.5运行json-server，出现以下界面代表运行成功

json-server.cmd--watchdb.jso5、整合axios5.1配置axios请求拦截器，新建utils文件夹，新建api.js，输入以下内容

exportconstinitTmpRoutes=(menus)=>{lettmpRoutes=[]menus.forEach(menu=>{let{id,title,icon,path,name,children}=menuif(childreninstanceofArray){children=initTmpRoutes(children)}lettmpRoute={path:path,meta:{icon:icon,title:title},name:name,children:children,component:children.length{render(c){returnc('router-view')}}:()=>import(`@/pages${path}/${name}.vue`)}console.log('tmpRoute',tmpRoute.path)tmpRoutes.push(tmpRoute)})returntmpRoutes}exportconstinitRoutes=(menus)=>{consthomeRoute={path:'/home',name:'Home',meta:{title:'首页',icon:'el-icon-star-off'},component:()=>import('@/pages/Home.vue'),}homeRoute.children=initTmpRoutes(menus);console.log('homeRoute',homeRoute)returnhomeRoute;}6.3首页、导航页和主页

home.vue

{{item.meta.title}}RecursiveMenu.vue

{{item.meta.title}}