浏览器的同源策略
不同协议、不同端口、不同域名。满足其中一个都会被浏览器的同源策略阻止,html5以后同源策略被放宽。
jsonp解决跨域的思想
script标签引用别的源不会出现问题,这是因为当时在设计这个script标签的时候,就允许别的源请求脚本,所以就产生了jsonp。但是ajax,fetch请求都会出现跨域问题。
简单地说:jsonp利用了script的漏洞去请求数据,所以jsonp只能发get请求。
CORS解决跨域的思想
根本原因:
基于 Ajax 请求跨域获取数据失败的真正原理是:浏览器禁止与当前网页不同来源的数据被使用。
解决方式:
CORS的核心简单来说就是设置头部Access-Control-Allow-Origin。当存在这个头部时,浏览器就会选择放行(本身跨域问题根源就是浏览器的同源策略,浏览器都选择放行了,这个问题自然而然也就解决了)。
CORS存在两种请求:简单跨域请求和复杂跨域请求
简单跨域请求:请求只会发送一次
复杂跨域请求:请求会发送两次,第一次是预检请求,第二次才是普通请求
预检请求:主要目的是从而获知服务端是否允许该跨域请求,次要目的是同时在预检请求的返回中,服务器端也可以通知客户端,是否需要携带身份凭证(包括 Cookies 和 HTTP 认证相关数据)。
设计的目的:减轻服务器的压力
反向代理解决跨域问题
如何使用反向代理解决跨域问题:在代理服务器上配置CORS解决跨域问题,服务器把数据传给代理,代理再将数据处理加上Access-Control-Allow-Origin字段传给浏览器解决跨域问题。实际上认真想想,正向代理也是可以解决跨域问题,原理都是一样的。
注意:浏览器、服务器、代理,这3个相互不同源。
首先不懂正向代理和反向代理的,可以看参考文档。
简单解释一下:如何区别正向代理和反向代理,看代理专门为谁服务,如果代理是为客户端服务那就是正向代理,如果代理是为服务端服务那就是反向代理
参考文档: