跨域访问sessionid不一致问题

 版权声明：本文为博主原创文章，未经博主允许不得转载

问题的产生
流程是这样的，要做一个用户登录的接口。在登录页面，前端先请求验证码，然后输入用户名密码和验证码之后，请求登录接口。
这里存在两个接口，验证码接口和登录接口。在验证码接口中我用session保存验证码，在登录接口中我从session取出验证码进行校验。

注意请求验证码图片的域名要和请求校验的域名一样,比如，localhost和127.0.0.1是不一样的

两个接口的代码如下:

 

 

两次获取的sessionid不一致，导致在登录时候，没有获取session中的验证码！ 

 

原来后台是做了一个跨域访问的设置

@Configuration
public class WebConfig implements WebMvcConfigurer {


    // 设置跨域访问
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("*")
                .allowedMethods("GET", "HEAD", "POST", "PUT", "PATCH", "DELETE", "OPTIONS", "TRACE")
                .allowCredentials(true);
    }


}

主要解释如下：
registry.allowedOrigins(““)设置跨域访问的域名，如果是，默认都可以访问。
这个方法是后来找到问题后，自己加上去的
registry.allowCredentials(true)设置是否允许客户端发送cookie信息。默认是false
 

 

解决问题

其实最后就做了两件事情， 
1. 服务端设置可以接收cookie信息

.allowCredentials(true);

2.在ajax请求中设置发送cookie信息

xhrFields: { withCredentials: true }

 

//验证输入的验证码
function checkCaptcha() {
    var username = $("#username").val();
    var password = $("#password").val();
    var captchaCode = $("#captchaCode").val();
    console.log(username + "：" + password + ":" + captchaCode);
    $.ajax({
        type: 'post',
        async: false,
        url: 'http://127.0.0.1:9001/login',
        xhrFields: {
            withCredentials: true
        },
        data: {
            "captchaCode": captchaCode,
            "username": username,
            "password": password
        },
        success: function (res) {
            alert(res);
        }
    });
}

 

 参考

https://blog.csdn.net/u011521890/article/details/73719198

https://blog.csdn.net/weixin_33733810/article/details/86954125