跨域请求资源的几种方式

由于浏览器同源策略,凡是发送请求URL的协议、域名、端口三者之间任意一与当前页面地址不同即为跨域。

(1)JSONP(jsonp跨域get请求) 

     这种方式主要是通过动态创建一个script标签,浏览器对script的资源引用没有同源限制,同时资源加载到页面后会立即执行;(创建script标签向不同域提交http请求的不会被拒绝的方法,jsonp标签的src属性是没有跨域限制的)

     实际项目中JSONP通常用来获取json格式数据,这时前后端通常约定一个参数callback,该参数的值,就是处理返回数据的函数名称;

缺点:这种方式无法发送post请求,另外要确定jsonp的请求是否失败并不容易,大多数框架的实现都是结合超时时间来判断。

 

(2)proxy

这种方式首先将请求发送给后台服务器,通过服务器来发送请求,然后将请求的结果传递给前端;

需要注意的是如果你代理的是https协议的请求,那么你的proxy首先需要信任该证书或者忽略证书检查,否则你的请求无法成功。

 

(3)cors

当你使用XMLHttpRequest发送请求时,浏览器发现该请求不符合同源策略,会给该请求头origin,后台进行一系列处理,如果确定接受请求则在返回结果加入一个响应头Access-Control-Allow-Origin;浏览器判断该响应头中是否包含Origin的值,如果有则浏览器会处理响应,我们就可以拿到响应数据,如果不包含浏览器直接驳回,这时我们无法拿到响应数据; 

 

post请求的content-type不是常规的三个:application/x-www-form-urlencoded(使用HTTP的post方式提交表单)、multipart/form-data(同上,但主要用于表单提交时伴随文件上传的场合)、text/plain(纯文本)

 

post请求的payload为text/html 

payload指在http中,应该是post请求时所携带的有效数据;

 

有一种跨域需要特别注意就是https协议下发送https请求,除了使用proxy代理外其他方法都无解,会被浏览器直接block掉。