一. Cors概述
1.1 什么是Cors?
- CORS 全称是跨域资源共享(Cross-Origin Resource Sharing),是一种 AJAX 跨域请求资源的方式,支持现代浏览器,IE支持10以上。
CORS与JSONP的使用目的相同,但是比JSONP更强大。JSONP只支持GET请求,CORS支持所有类型的HTTP请求。JSONP的优势在于支持老式浏览器,以及可以向不支持CORS的网站请求数据。
简单来说Cors就是用来解决跨域问题的。此外解决的方式还有:Nginx反向代理,Jsoup等方式。不过Nginx不符合Devops理念,不易维护,而Jsoup支持的请求类型只支持Get请求。Cors更为适合;
1.2 什么是跨域?
- 同源就是指:域名,协议,端口 均相同
- 跨域就是指: 域名,协议,端口 其中至少有一个是不同的;
- 当前端请求后端接口的时候,当端口号,ip地址等不一致的时候,为了安全性考量,请求所响应的数据不会被前端展示。等于请求的数据没有被标识为友军,没有被证明是敌是友;
ajax请求才会出现跨域
1.3 Cors能解决什么问题?
- 通过在服务端配置Cors相关的东西,能识别是否给予跨域权限,然后给予能跨域的标识,通过此标识,浏览器就可以渲染返回来的数据啦~~
二. Cors在SpringCloud微服务中的使用;
2.1 环境:
- JDK1.8 IDEA SpringCloud微服务 网关使用Zuul
2.2 代码:
package com.leyou.gateway.config;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;
@Configuration
public class CorsConfiguration {
@Bean
public CorsFilter corsFilter(){
//配置初始化对象
CorsConfiguration configuration=new CorsConfiguration();
//允许跨域的域名,如果要携带cookie,不能写* 。 *:代表所有的域名都可以访问
configuration.addAllowedOrigin("http://localhost:9001");
configuration.setAllowCredentials(true);
configuration.addAllowedMethod("*"); //代表所有的请求方法
configuration.addAllowedHeader("*"); //允许携带任何头信息
//初始化cors配置源对象
UrlBasedCorsConfigurationSource configurationSource=new UrlBasedCorsConfigurationSource();
configurationSource.registerCorsConfiguration("/**",configuration);
//返回corsFilter实例,参数:cors配置源对象
return new CorsFilter(configurationSource);
}
}
注意,这里的代码是写在Zuul微服务中的
2.3 配置中需要注意的地方:
- 前端请求观察orgin:
这里是`http://localhost:9001**,所以后端如果不是使用 * 的话,则要加这个地址;否则跨域实现不了!
- 如图所示: