前后端分离后,如何保持session Id 不变,前后端都要进行跨域的设置。
前端界面效果如下:
前端ajax如下:
$("#btnSubmit").click(function(){
var userNo=$("#user").val();
var userPwd=$("#pwd").val();
console.log(userNo);
console.log(userPwd);
var obj={};
obj.userName=$("#user").val();
obj.userPwd=$("#pwd").val();
$.ajax({
url : "http://localhost:8081/InfoUserTMapper/login.do",
type : "post",
contentType:"application/json;charset=utf-8",
dataType:"json",
async: false,
xhrFields: {
withCredentials: true
},
data:JSON.stringify(obj),//json对象转换成字符串
success: function(rs){
if(rs.status==200){
console.log(rs);
location.href="index.html";
}else{
}
},onLoadError:function(){
}
});
});
后端 controller:
@Slf4j @RestController @RequestMapping("InfoUserTMapper") @Api(tags = "用户信息") public class InfoUserTController { @ApiOperation(value = "登录") @RequestMapping(path="/login",method= RequestMethod.POST) public JSONResult login(@RequestBody LoginRo loginRo, HttpServletRequest request, HttpServletResponse response){ log.info("login:"+loginRo.getUserName()); HttpSession session=request.getSession(); log.info("login_session_id:"+session.getId()); Cookie cookie = new Cookie("userName",loginRo.getUserName()); cookie.setPath("/"); response.addCookie(cookie); return JSONResult.ok(); }
WebMvcConfigurer 过滤器:
/** * 允许跨域调用的过滤器 */ @Bean public CorsFilter corsFilter() { CorsConfiguration config = new CorsConfiguration(); //允许所有域名进行跨域调用 config.addAllowedOrigin("*"); //允许跨越发送cookie config.setAllowCredentials(true); //放行全部原始头信息 config.addAllowedHeader("*"); //允许所有请求方法跨域调用 config.addAllowedMethod("*"); UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource(); source.registerCorsConfiguration("/**", config); CorsFilter corsFilter=new CorsFilter(source); return new CorsFilter(source); }