Umi与Keycloak整合

Umi与Keycloak整合
 
刚开始使用umi时,使用umi官方提供的命令生成项目,并且其中使用了ant design pro的样式,其中会帮忙生成一些页面,例如页面框架及用户登陆页面
 
但,目前是想将keycloak整合到系统中,所以需要引入keycloak至项目中,我目前的做法是通过routes.ts中的路由中查看到,大部分的页面都是使用SecurityLayout的,那么就从这个Component入手

 

 

 
在componentDimMount的事件中,直接调用keycloak的初始化事件,如果没有登陆则直接转入login页面

 

 

 
 
存放在utils中的keycloak.ts如下

 

 

 
在http发送请求前,将token加入至请求中

 

 

 
 
整体处理流程

 

 

 

posted @ 2021-01-29 14:57  WesChan  阅读(838)  评论(0编辑  收藏  举报