跨域:指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是浏览器对javascript施加的安全限制。
• 同源策略:是指协议,域名,端口都要相同,其中有一个不同都会产生跨域;
比如在登录中就会先发送有预检请求
简单请求某些请求不会触发 CORS 预检请求。本文称这样的请求为“简单请求”,请注意,该术语并不属于 Fetch(其中定义了 CORS)规范。若请求 满足所有下述条件,则该请求可视为“简单请求”:使用下列方法之一:
GET,HEAD,POST
除了被用户代理自动设置的首部字段(例如 Connection,User-Agent)和在 Fetch 规范中定义为 禁用首部名称 的其他首部,允许人为设置的字段为 Fetch 规范定义的 对 CORS 安全的首部字段集合。该集合为:
AcceptAccept-LanguageContent-LanguageContent-Type(需要注意额外的限制)
Content-Type 的值仅限于下列三者之一:
text/plainmultipart/form-dataapplication/x-www-form-urlencoded
请求中的任意 XMLHttpRequest 对象均没有注册任何事件监听器;XMLHttpRequest 对象可以使用 XMLHttpRequest.upload 属性访问。
请求中没有使用 ReadableStream 对象。
何为简单请求何位非简单请求具体可以查看https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS
解决:在微服务项目中可以在网关中添加一个CorsWebFilter
@Configuration
public class CorsConfig {
/**
* 配置跨域
* 每个需要跨域的请求都添上某些字段很麻烦所有写一个filter
* 解决跨域问题,通过filter给响应添加某些响应头
* reactive包下的
* @return
*/
@Bean
public CorsWebFilter corsWebFilter(){
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
CorsConfiguration corsConfiguration = new CorsConfiguration();
corsConfiguration.addAllowedOrigin("*");//支持那些源的请求跨域
corsConfiguration.addAllowedHeader("*");
corsConfiguration.addAllowedMethod("*");//支持那些方式跨域 post put delete等
corsConfiguration.setAllowCredentials(true);//包含cookie
corsConfiguration.setMaxAge(6000000L);//表明该响应的有效时间为多少秒。在有效时间内,浏览器无 须为同一请求再次发起预检请求。请注意,浏览器自身维护了一个最大有效时间,如果 该首部字段的值超过了最大有效时间,将不会生效。
source.registerCorsConfiguration("/**",corsConfiguration);//任意路径都进行跨域配置
return new CorsWebFilter(source);
}
}