get请求没有跨域问题?-灵析社区

劳资最帅

**背景:** 项目中,原先服务端`Access-Control-Allow-Origin`设置的值为`*`,前端请求访问正常; 后来由于公司安全限制,`*`更改为一系列的白名单列表(域名列表),本地调试时由于诸如`http://localhost:8090`的域名不在白名单之内,所以前端接口请求会报错。 报错详情如下: status code: 403 message: invalid corse 说明有跨域问题了,请求不成功。 **解决方案:** 服务端在之前的白名单列表`Access-Control-Allow-Origin`中加上了`http://localhost:8090`,所有访问正常——包括get请求和post请求都正常。 **奇怪的现象:** 在`Access-Control-Allow-Origin`未添加`http://localhost:8090`之前, * get请求: 请求正常 * post请求:请求出错,有403 跨域问题报错 **区别:** get请求 请求头没有origin,post请求头有origin。 **get请求请求表头如下:** ![image.png](https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240928/deae797a785653376521fe2291bc8f60.png) **总结下,主要有如下几个疑问:** 1. 为什么get请求不会有跨域问题。 2. 为什么get请求请求头没有origin字段,post请求请求头有origin字段。 3. 本地调试,除了让后端在白名单里面加上localhost域名,还有其它更好的方案吗?

阅读量:136

点赞量:0

问AI
简单回答 1. 为什么get请求不会有跨域问题。 第1个问题不成立。 GET请求会有跨域问题! 你问题中描述的现象,很有可能是get请求被浏览器使用了缓存 你可以打开开发者工具,先确认”停用缓存“没有被启用,然后看请求,应该能看到下面截图一样的内容。 "企业微信截图_95385bce-79ec-4c88-97b9-507203741713.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240928/22d5c49a4a8d08b49dfa685fcadade7d.png) 2. 为什么get请求请求头没有origin字段,post请求请求头有origin字段。 跨源请求,一定会有origin字段的,这第2个问题本身也不成立。 有种特殊情况: 除了同源时get和head请求不添加origin, 还有如果在 no-cors 模式下发起了跨域的get或head请求,orgin也不会自动添加。 There are some exceptions to the above rules; for example, if a cross-origin GET or HEAD request is made in no-cors mode, the Origin header will not be added. "no-cors" 模式是在浏览器中使用 Axios 进行 HTTP 请求时可以使用的一种模式。 这种模式下,浏览器会忽略跨域安全限制,从而允许你发送请求到不同的域名。但是,这种模式下的请求不会返回响应头信息,也不会触发浏览器的跨域安全策略。 axios.get('http://example.com', { mode: 'no-cors' }); 3. 本地调试,除了让后端在白名单里面加上localhost域名,还有其它更好的方案吗? 本地使用host给127.0.0.1配置域名,这个域名在已知白名单上。如果白名单用的是https协议,本地这个服务还得用个自签名证书。