JS跨域问题

1.什么是跨域？

出于浏览器的同源策略限制。同源策略（Sameoriginpolicy）是一种约定，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的，浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。所谓同源（即指在同一个域）就是两个页面具有相同的协议protocol），主机（host）和端口号（port）
当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域。

2.如何解决跨域问题？

方案一：使用nginx反向代理

将url映射成同源的

方案二：使用jsonp

JSONP 是服务器与客户端跨源通信的常用方法。最大特点就是简单适用，兼容性好（兼容低版本
IE），缺点是只支持get请求，不支持post请求。
核心思想：网页通过添加一个 元素，向服务器请求 JSON 数据，服务器收到请求后，将数据放在
一个指定名字的回调函数的参数位置传回来。

方案三：使用CROS

CORS是一个W3C标准，全称是"跨域资源共享"（Cross-origin resource sharing）。CORS需要浏
览器和服务器同时支持。目前，所有浏览器都支持该功能，IE浏览器不能低于IE10。它允许浏览器
向跨源服务器，发出XMLHttpRequest请求，从而克服了A JAX只能同源使用的限制。整个CORS通
信过程，都是浏览器自动完成，不需要用户参与。对于开发者来说，CORS通信与同源的A JAX通信
没有差别，代码完全一样。浏览器一旦发现A JAX请求跨源，就会自动添加一些附加的头信息，有
时还会多出一次附加的请求，但用户不会有感觉。因此，实现CORS通信的关键是服务器。只要服
务器实现了CORS接口，就可以跨源通信。

3.SpringBoot中使用CROS

在springboot中使用CROS非常简单，只需要在Controller类上添加上 @CrossOrigin 注解就可以实现

@RestController 
@RequestMapping("/brand") 
@CrossOrigin 	//在springboot中使用CROS
public class BrandController { @Autowired private ApiBrandFeign apiBrandFeign; @RequestMapping(value = "/query/{page}/{rows}", method = RequestMethod.POST) public HttpResult queryBrand(@RequestBody(required = false) Brand brand,@PathVariable Integer page, @PathVariable Integer rows){ //分页查询 return apiBrandFeign.findPage(brand,page,rows); 
} 
}

当然在Controller上添加 @CrossOrigin 后只对当前Controller中的url生效，这样使用起来是非常麻烦的，所以如果想一劳永逸的话，推荐在zuul网关中配置CROSFilter