Ajax 请求和跨域

跨域的几种方式:

cors方式

cross-orign-resource-shareing(跨域)
参考:http://www.ruanyifeng.com/blog/2016/04/cors.html

分为简单请求和非简单请求。
非简单请求会发送preflight(预请求)

cors跨域方式是浏览器自己带的。
主要控制方式是在服务器端,同时需要浏览器的部分配合。

浏览器端主要的方法:
Access-Control-Request-Origin(Origin)
Access-Control-Request-Method
Access-Control-Request-Headers
带凭据的请求
withCreditials:

服务器主要的方法:
Access-Control-Allow-Origin:
Access-Control-Allow-Methods:
Access-Control-Alllow-Headers:
Access-Control-Max-Age:
带凭据的请求
Access-Control-Allow-Creditials:

JSONP

参考:https://segmentfault.com/a/1190000015597029
后台服务相当于中转站,在前端的一个script标签里创建另一个script标签,并指定新的script标签的src,把方法和参数都从url中传给后台。
后台得到url中的参数(包括方法和方法参数),返回到前端,作为新的script的内容执行带参函数。

缺陷:
1.只能用get方法;
2.不安全:从其它域中引用代码,一定要保证安全,一旦出现安全问题,几乎要放弃使用;
3.不能判断jsonp是否请求失败。script标签的onerror事件浏览器支持性不是很好。

iframe跨域

1. 空iframe+form表单 v

2. iframe + document.domain v

3. iframe + window.name v

4. iframe + location.hash

5. iframe + postMessage v

nginx

知识补充

和跨域相关的一个设计模式是代理模式

概念:由于一个对象不能直接访问另一个变量,所以要通过一个中间变量去访问另一个变量。
JSONP代理模式:被代理者是要请求的html,请求的url返回数据的那个域属于代理域,代理域和被代理域在同一个域名下,代理域指的是动态的script标签。请求的url是另一个域。
xxx + iframe 跨域: 被代理者是要请求的html,请求的url返回的那个域属于代理域,代理域和被代理域在同一个域名下,代理域指的是iframe。请求的url是另一个域。(window.name,iframe + form表单,window.postMessage,document.domain,location.hash)

你可能感兴趣的:(Ajax 请求和跨域)