Vue前端set-cookie 问题解决
1 修改axios默认配置, 使得每次请求默认携带cookie. main.js全局配置的
import axios from 'axios'
axios.defaults.withCredentials=true;
后端Java set-cookie 问题解决
1 后端设置前端可以跨域的配置
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
@Configuration
class CrossConfig implements WebMvcConfigurer {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")
.allowedOrigins("https://domain.com")
//.allowedMethods("GET","HEAD","POST","PUT","DELETE","OPTIONS")
//.allowedHeaders("Set-Cookie","Referer","Host","Origin","Accept","DNT",
// "X-Mx-ReqToken","Keep-Alive","User-Agent","X-Requested-With",
// "If-Modified-Since","Cache-Control","Content-Type","Authorization")
.allowedMethods("*")
.allowedHeaders("*")
.allowCredentials(true)
.maxAge(3600);
//.allowedHeaders("*");
}
}注意Origins必须为前端域名,不能为*号
2 设置 cookie 属性
@Bean("sessionIdCookie")
public SimpleCookie sessionIdCookie(){
SimpleCookie simpleCookie = new SimpleCookie("sid");
log.info(domain);
simpleCookie.setDomain(domain.com);
simpleCookie.setHttpOnly(true);
simpleCookie.setSameSite(Cookie.SameSiteOptions.valueOf("NONE"));
simpleCookie.setSecure(true);
simpleCookie.setPath("/");
//maxAge=-1表示浏览器关闭时失效此Cookie
//simpleCookie.setMaxAge(-1);
return simpleCookie;这样就可以解决前后端模式下,后端不能设置cookie
Nginx 配置后端跨域(此方法最终证明还是有效的)
add_header 'Access-Control-Allow-Methods' 'GET,OPTIONS,PUT,POST,PATCH,DELETE' always;
add_header 'Access-Control-Allow-Credentials' 'true' always;
add_header 'Access-Control-Allow-Origin' '$http_origin' always;
add_header 'Access-Control-Allow-Headers' Set-Cookie,Referer,Host,Origin,Accept,DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization' always;
if ($request_method = OPTIONS ) {
return 200;
}








