vue+springboot前后端分离实现单点登录跨域问题解决方法前后端分离实现单点登录跨域问题解决方法
主要介绍了vue+springboot前后端分离实现单点登录跨域问题的解决方法,需要的朋友可以参考下
最近在做一个后台管理系统，前端是用时下火热的vue.js，后台是基于springboot的。因为后台系统没有登录功能，但是公司
要求统一登录，登录认证统一使用.net项目组的认证系统。那就意味着做单点登录咯，至于不知道什么是单点登录的同学，建
议去找一下万能的度娘。
刚接到这个需求的时候，老夫心里便不屑的认为：区区登录何足挂齿，但是，开发的过程狠狠的打了我一巴掌（火辣辣的一巴
掌）。。。，所以这次必须得好好记录一下这次教训，以免以后再踩这样的坑。
我面临的第一个问题是跨域，浏览器控制台直接报CORS,以我多年开发经验，我果断在后台配置了跨域配置，代码如下：
@Configuration
public class CorsConfiguration {
@Bean
public WebMvcConfigurer corsConfigurer() {
return new WebMvcConfigurerAdapter() {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")
.allowedHeaders("*")
.allowedMethods("*")
.allowedOrigins("*");
}
};
}
}
这个配置就是允许所有mapping，所有请求头，所有请求方法，所有源。改好配置之后我果断重启项目，看效果，结果发现根
本没法重定向跳转到单点登录页面，看浏览器报错是跨域导致的，我先上我登录拦截器的代码
public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
//用户已经登录
if (request.getSession().getAttribute("user") != null) {
return true;
}
//从单点登录返回之后的状态，本系统还不处于登录状态
//根据code值去获取access_token，然后再根据access_token去获取用户信息，并将用户信息存到session中
String state = request.getParameter("state");
String uri = getUri(request);
if (isLoginFromSSO(state)) {
String code = request.getParameter("code");
Object cacheUrl = request.getSession().getAttribute(state);
if (cacheUrl == null) {
response.sendRedirect(uri);
return false;
}
HttpUtil client = new HttpUtil();
StringBuffer sb = new StringBuffer();
sb.append("code=").append(code)
.append("&grant_type=").append("authorization_code")
.append("&client_id=").append(SSOAuth.ClientID)
.append("&client_secret=").append(SSOAuth.ClientSecret)
.append("&redirect_uri=").append(URLEncoder.encode((String) cacheUrl));
String resp = client.post(SSOAuth.AccessTokenUrl, sb.toString());
Map<String, String> map = new Gson().fromJson(resp, Map.class);
//根据access_token去获取用户信息
String accessToken = map.get("access_token");
HttpUtil http = new HttpUtil();
http.addHeader("Authorization", "Bearer " + accessToken);
String encrypt = http.get(SSOAuth.UserUrl);
String userinfo = decryptUserInfo(encrypt);
//封装成user对象
User user = new Gson().fromJson(userinfo, User.class);
request.getSession().setAttribute("user", user);
return true;
}
//跳转到单点登录界面
state = Const._SSO_LOGIN + Const.UNDERLINE + RandomUtil.getUUID();
request.getSession().setAttribute(state, uri);
String redirectUrl = buildAuthCodeUrl(uri, state);
response.sendRedirect(redirectUrl);
return false;
}
后面把前端vue请求后台的登录接口方式直接用
资源评论
乖乖也会2020-10-21浪费积分！！
weixin_38545243
- 粉丝: 7
- 资源: 899
最新资源
- 基于ROS的疫情防控智能小车设计源码
- 基于Python的Excel转JSON数据表配置工具源码
- 基于Springboot+Bootstrap+MyBatis+MySQL的蔬菜管理系统源码设计
- 基于C++等语言的日常编程练习源码分享
- 基于Python和Java的HanLP设计源码
- 基于MVP+Rx+Retrofit等架构的综合生活助手Java设计源码
- COMSOL 相场法与水力压裂 案例一：单一裂缝延伸； 案例二：两簇压裂； 案例三：三簇压裂-对称； 案例四：三簇压裂-完全；
- 基于Python语言的就业统计网站设计源码
- 永磁同步电机模型参考自适应无传感器矢量控制仿真，永磁同步电机MRAS仿真 采用模型参考自适应控制，实现中高速稳定控制； 转速采用
- 基于Python的入门级人脸、视频、文字检测与识别项目设计源码
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
