前台setcookie之后从后台取出来_vue axios springboot前后端分离项目为什么前台无法获取后台返回的cookie?...

本文讨论了在Vue、Axios和SpringBoot构建的前后端分离项目中,为何前台无法获取后台返回的Cookie。问题源于CORS策略和同源政策的限制,即使后台设置允许跨域并暴露了Cookie头,由于前端和API地址不同,导致Cookie无法被正常读取。解决方案可能涉及调整后端CORS配置和确保正确设置Cookie的域。
摘要由CSDN通过智能技术生成

看了个文章明白了

http://www.ruanyifeng.com/blog/2016/04/cors.html

文章中有说:

3.2:

需要注意的是,如果要发送Cookie,Access-Control-Allow-Origin就不能设为星号,必须指定明确的、与请求网页一致的域名。同时,Cookie依然遵循同源政策,只有用服务器域名设置的Cookie才会上传,其他域名的Cookie并不会上传,且(跨源)原网页代码中的document.cookie也无法读取服务器域名下的Cookie。

请注意

且(跨源)原网页代码中的document.cookie也无法读取服务器域名下的Cookie。

前台可读取的

headers:

"content-type": "application/json;charset=UTF-8"

​haha: "woshikaikai"

响应头:

Accept

application/json, text/plain, */*

Accept-Encoding

gzip, deflate

Accept-Language

zh-CN,zh;q=0.8,zh-TW;q=0.7,zh-HK;q=0.5,en-US;q=0.3,en;q=0.2

Connection

keep-alive

Content-Length

26

Content-Type

application/json;charset=utf-8

Cookie

token=eyJhbGciOiJIUzI1NiJ9.eyJ…XiYBLEsjAAo4zUv3vhDPLckUcVfIY

Host

192.168.1.107:8088

Origin

http://127.0.0.1:8080

Referer

http://127.0.0.1:8080/login

User-Agent

Mozilla/5.0 (Windows NT 10.0; …) Gecko/20100101 Firefox/62.0

后端服务器设置:

Configuration

public class CorsConfig implements WebMvcConfigurer {

@Override

public void addCorsMappings(CorsRegistry registry) {

//设置允许跨域的路径

registry.addMapping("/**")

//设置允许跨域请求的域名

.allowedOrigins("http://127.0.0.1:8080")

//是否允许证书 不再默认开启

.allowCredentials(true)

//设置允许的方法

.allowedMethods("*")

.allowedHeaders("*")

.exposedHeaders(HttpHeaders.SET_COOKIE, "haha")

//跨域允许时间

.maxAge(3600);

}

}

但是即使后台设置了

.exposedHeaders(HttpHeaders.SET_COOKIE)

前台也是无法获取cookie的

问题描述

我也看了很多跨域文章

总的就是说

后台

这两个配置一下

.allowedOrigins("http://g3.zk1.local.csljc.com:8083")

//是否允许证书 不再默认开启

.allowCredentials(true)

//给请求的返回内容中写入cookie

public static void writeCookie(HttpServletResponse response, String cookieName, String value) {

Cookie cookie = new Cookie(cookieName, value);

cookie.setPath("/");

cookie.setMaxAge(3000 * 60);

cookie.setDomain("g3.zk1.local.csljc.com");

response.addCookie(cookie);

}

前台:

const axios = Axios.create({

baseURL: 'http://192.168.51.194:8021', // api的base_url

withCredentials: true,

timeout: 30000 // request timeout

})

访问前台项目地址为

http://g3.zk1.local.csljc.com:8083

后台api接口地址为:

192.168.51.194:8021

我看网上人家都说这么配置就行了,为啥我这里不行啊

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值