如何解决跨域

什么是跨域问题？

跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对 JavaScript 施加的安全限制。

跨域通常可以通过前后端来解决，本篇文章主要介绍后端的解决办法。

什么是同源？

所谓同源是指，域名，协议，端口均相同

• http://www.yushuzi.com --> http://admin.yushuzi.com 跨域
• http://www.yushuzi.com --> http://www.yushuzi.com 非跨域
• http://www.yushuzi.com --> http://www.yushuzi.com:8080 跨域
• http://www.yushuzi.com --> https://www.yushuzi.com 跨域

通过注解的方式允许跨域

可以在Controller类或其方法上加@CrossOrigin注解，来使之支持跨域。

例如：

@CrossOrigin(origins = "*", maxAge = 3600)
@RestController
@RequestMapping("/Admin")
public class AdminController {
    system.out.println(“看懂没？”);
}

 

使用 CORS（跨资源共享）解决跨域问题

CORS 是一个 W3C 标准，全称是"跨域资源共享"（Cross-origin resource sharing）。它允许浏览器向跨源服务器，发出 XMLHttpRequest 请求，从而克服了 AJAX 只能同源使用的限制。

CORS 需要浏览器和服务器同时支持。目前，所有浏览器都支持该功能，IE 浏览器不能低于 IE10

整个 CORS 通信过程，都是浏览器自动完成，不需要用户参与。对于开发者来说，CORS 通信与同源的 AJAX 通信没有差别，代码完全一样。浏览器一旦发现 AJAX 请求跨源，就会自动添加一些附加的头信息，有时还会多出一次附加的请求，但用户不会有感觉

因此，实现 CORS 通信的关键是服务器。只要服务器实现了 CORS 接口，就可以跨源通信

 

通过配置文件的方式允许跨域

在web.xml中添加如下配置：

<filter-mapping>
<filter-name>CorsFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>

使用Filter属性即可让整个服务器全局允许跨域。

 

CORS 与 JSONP 的比较

CORS 与 JSONP 的使用目的相同，但是比 JSONP 更强大。

JSONP 只支持 GET 请求，CORS 支持所有类型的 HTTP 请求。JSONP 的优势在于支持老式浏览器，以及可以向不支持 CORS 的网站请求数据。