博客

背景：我的项目中有一个发送邮箱验证码和检验的功能，通过redis，以sessionid为键，随机验证码为值，但是我发现获取验证码和点击注册时检验验证码的sessionid总是不同，在页面检查中选择网络发现set-cookie后面有一个黄标显示：“Set-Cookie没有指定“SameSite”属性，它被默认为“SameSite=Lax”，并被阻止，因为它来自一个cross-site响应，而不是对top-level导航的响应。Set-Cookie必须设置为“SameSite=None”才能启用cross-site用法”。问题原因是前后端跨域。

过程：在网上寻找解决方法的过程中我发现了一下几种方法：

1.在vue中添加

axios.defaults.withCredentials = true

没有解决问题

2.在springboot中添加

 private CorsConfigurationSource configuration(){
        CorsConfiguration configuration=new CorsConfiguration();
        //允许所有的请求,只能用于测试,非常危险
        configuration.addAllowedOriginPattern("*");
        configuration.addAllowedHeader("*");
        configuration.addAllowedMethod("POST");
        configuration.addAllowedMethod("GET");
        //允许携带cookie
        configuration.setAllowCredentials(true);
        configuration.setMaxAge(3600L);

        UrlBasedCorsConfigurationSource source=new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**",configuration);
        return source;
    }

依然没有解决问题

3.通过chrome://flags/更改浏览器设置，后来发现新版本chrome没有给出相关设置， 也没有成功

4.关闭csrf，依然没有解决问题

5.使用Web相关配置

@Configuration
public class WebConfig implements WebMvcConfigurer {
    //解决前后端分离跨域问题,并没有解决
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")//设置允许跨域的路径
                .allowedOrigins("http://127.0.0.1:8080")//设置允许跨域请求的域名
                .allowCredentials(true)//是否允许证书 不再默认开启
                .allowedMethods("GET", "POST", "PUT", "DELETE")//设置允许的方法
                .maxAge(3600);//跨域允许时间
    }

}

依然没有解决问题

最后：我询问chatgpt：“怎么在spring security中设则Samesite = None Secure->”，再根据自身代码不断追问终于得到了答案

在

application.yml

文件中配置：

server:
  servlet:
    session:
      cookie:
        http-only: true
        secure: true
        same-site: none

最终解决了问题