跨域

1 跨域

由于浏览器对于Javascript的同源策略的限制，导致A网站不能通过JS（主要就是Ajax请求）去访问B网站的数据，于是就出现了跨域问题。

域名、端口、协议的组合不同就是跨域

解决跨域的方式有多种，比如基于JavaScript的解决方式、基于Jquery的JSONP方式、以及基于CORS的方式

2 CORS

CORS是一个W3C标准，全称是"跨域资源共享"（Cross-origin resource sharing）。
它允许浏览器向跨源服务器，发出XMLHttpRequest请求，从而克服了AJAX只能同源使用的限制。
CORS原理：只需要向响应头header中添加Access-Control-Allow-Origin，这样浏览器检测到header中的Access-Control-Allow-Origin，则就可以跨域操作了

CORS分为简单请求和非简单请求(需预检请求)两类

2.1 简单请求

请求方式使用下列方法之一：
GET
HEAD
POST
Content-Type 的值仅限于下列三者之一：
text/plain
multipart/form-data
application/x-www-form-urlencoded
在header中加入origin请求头字段。同样，在响应头中，返回服务器设置的相关CORS头部字段，Access-Control-Allow-Origin字段为允许跨域请求的源。请求时浏览器在请求头的Origin中说明请求的源，服务器收到后发现允许该源跨域请求，则会成功返回，具体如下：

2.1 非简单请求

使用了下面任一 HTTP 方法：
PUT
DELETE
CONNECT
OPTIONS
TRACE
PATCH
Content-Type 的值不属于下列之一:
application/x-www-form-urlencoded
multipart/form-data
text/plain

浏览器会自动先发送一个options请求，如果发现服务器支持该请求，则会将真正的请求发送到后端

3 spring Mvc实现cros

http://www.cnblogs.com/sloong/p/cors.html
在配置文件中添加跨域配置

@Configuration
@EnableWebMvc
public class ConfigAdapter implements WebMvcConfigurer {
	@Override
	public void addCorsMappings(CorsRegistry registry) {
	    registry.addMapping("/**").allowedOrigins("*")
	            .allowedMethods("*").allowedHeaders("*")
	            .allowCredentials(true);
	}
}

<p>
   <button onclick="testCros()">跨域测试</button>
   <script type="text/javascript">
       function testCros(){
           $.ajax({
               type:"get",
               url:'http://localhost:8088/hello',
               dataType:"json",
               success: function(data) {
                   alert(data);
               }
           });
       }
   </script>
</p>