跨域请求

跨域问题是由浏览器的同源策略(Same-Origin Policy)导致的。同源策略是浏览器的一项安全策略,它限制了来自不同源的脚本在同一文档(网页)中运行,以防止恶意脚本窃取数据或进行CSRF(Cross-Site Request Forgery,跨站请求伪造)等攻击。

同源指的是协议、域名、端口号都相同的两个URL,如果两个URL中有任意一项不同,就被视为跨域。跨域请求被浏览器禁止是因为它可能会向其他域名发送敏感数据,因此浏览器默认不允许跨域请求,除非响应头中设置了允许跨域访问的策略(如CORS)或使用了跨域请求的解决方案(如JSONP)。

在实际的Web开发中,跨域问题是很常见的,比如在开发前后端分离的应用时,前端可能会向不同的服务器发起请求,这就涉及到跨域问题。因此,在开发应用时需要注意跨域问题,并采取相应的解决方案。

总结:浏览器(客户端)为了防止你向其它域名发送敏感信息,因此只允许同源(协议、域名、端口号全部相等)的请求发送。

注意:只有浏览器向服务器发送才会出现跨域问题。服务器端发起的请求并不受同源策略的限制,因此不会出现跨域问题,但可能会出现安全问题。


实现跨域

基本上有7种方法实现跨域:

JSONP(JSON with Padding):通过动态创建script,再请求一个带参网址实现跨域通信。JSONP虽然解决了跨域问题,但它存在一些缺陷,如安全性差、只支持GET请求等。随着CORS的广泛应用,JSONP的使用也逐渐被取代。

document.domain + iframe跨域:两个页面都通过js强制设置document.domain为基础主域,就实现了同域。

location.hash + iframe跨域:a欲与b跨域相互通信,通过中间页c来实现。 三个页面,不同域之间利用iframe的location.hash传值,相同域之间直接js访问来通信。

window.name + iframe跨域:通过iframe的src属性由外域转向本地域,跨域数据即由iframe的window.name从外域传递到本地域。

postMessage跨域:可以跨域操作的window属性之一。

CORS(Cross-Origin Resource Sharing):中文名为跨域资源共享,服务端设置Access-Control-Allow-Origin即可,前端无须设置,若要带cookie请求,前后端都需要设置。

代理跨域:起一个代理服务器,实现数据的转发。