跨域请求资源的几种方式

跨域请求资源的几种方式

由于浏览器同源策略,凡是发送请求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掉。

时间: 2025-01-24 01:08:00

跨域请求资源的几种方式的相关文章

探讨跨域请求资源的几种方式

什么是跨域 JSONP proxy代理 cors xdr 由于浏览器同源策略,凡是发送请求url的协议.域名.端口三者之间任意一与当前页面地址不同即为跨域.具体可以查看下表(来源) JSONP 这种方式主要是通过动态插入一个script标签.浏览器对script的资源引用没有同源限制,同时资源加载到页面后会立即执行(没有阻塞的情况下). 1 <script> 2 var _script = document.createElement('script'); 3 _script.type = &

什么是跨域?跨域请求资源的方法有哪些?

1.什么是跨域? 由于浏览器同源策略,凡是发送请求url的协议.域名.端口三者之间任意一与当前页面地址不同即为跨域.存在跨域的情况: 网络协议不同,如http协议访问https协议. 端口不同,如80端口访问8080端口. 域名不同,如qianduanblog.com访问baidu.com. 子域名不同,如abc.qianduanblog.com访问def.qianduanblog.com. 域名和域名对应ip,如www.a.com访问20.205.28.90. 2.跨域请求资源的方法: (1)

js跨域请求数据的3种常用的方法

由于js同源策略的影响,当在某一域名下请求其他域名,或者同一域名,不同端口下的url时,就会变成不被允许的跨域请求.那这个时候通常怎么解决呢,对此菜鸟光头我稍作了整理:1.JavaScript   在原生js(没有jQuery和ajax支持)的情况下,通常客户端代码是这样的(我假设是在localhost:8080的端口下的http://localhost:8080/webs/i.mediapower.mobi/wutao/index.html页面的body标签下面加入以下代码): <script

谈谈跨域请求数据的几种常用的方法

由于js同源策略的影响,当在某一域名下请求其他域名,或者同一域名,不同端口下的url时,就会变成不被允许的跨域请求. 那这个时候通常怎么解决呢,对此菜鸟光头我稍作了整理: 1.JavaScript 在原生js(没有jQuery和ajax支持)的情况下,通常客户端代码是这样的(我假设是在localhost:8080的端口下的http://localhost:8080/webs/i.mediapower.mobi/wutao/index.html页面的body标签下面加入以下代码): <script

跨域请求之jsonp的实现方式

ajax请求受同源策略影响,不允许进行跨域请求,而script标签src属性中的链接却可以访问跨域的js脚本,利用这个特性,服务端不再返回JSON格式的数据,而是返回一段调用某个函数的js代码,在src中进行了调用,这样实现了跨域. 1 (function(){ 2 $jsonp(//地址 3 'http://api.douban.com/v2/movie/in_theaters', 4 //传递的参数 5 { 6 count:10,start:5 7 }, 8 //回调函数 9 functio

跨域请求资源

什么是同源策略? 同源策略阻止从一个域上加载的脚本获取或操作另一个域上的文档属性.也就是说,受到请求的 URL 的域必须与当前 Web 页面的域相同.这意味着浏览器隔离来自不同源的内容,以防止它们之间的操作.这个浏览器策略很旧,从 Netscape Navigator 2.0 版本开始就存在. URL                                 说明 是否允许通信 http://www.a.com/a.js http://www.a.com/b.js            

ajax 跨域请求资源问题

其实相当的简单:只需要在服务端设置一下响应头: header("Access-Control-Allow-Origin: *");就可以了!! nice,有木有? 下面两句也可以带上: header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept"); header('Access-Control-Allow-Methods: GET, POST, PUT')

65.django中csrftoken跨站请求伪造的几种方式

1.介绍 我们之前从前端给后端发送数据的时候,一直都是把setting中中间件里的的csrftoken这条给注释掉,其实这个主要起了一个对保护作用,以免恶意性数据的攻击.但是这样直接注释掉并不是理智型的选择,这里我们介绍以下几种方式来解决这个问题. 2.方式一 在前端中添加{% csrf_token %},前端ajax发送的data数据中加上: csrfmiddlewaretoken: $("[name='csrfmiddlewaretoken']").val() 3.方式二 在aja

django中csrftoken跨站请求伪造的几种方式

1.介绍 我们之前从前端给后端发送数据的时候,一直都是把setting中中间件里的的csrftoken这条给注释掉,其实这个主要起了一个对保护作用,以免恶意性数据的攻击.但是这样直接注释掉并不是理智型的选择,这里我们介绍以下几种方式来解决这个问题. csrf原理:先发送get请求,在用户浏览器上藏一段随机字符串,发送post请求时,浏览器自动携带该字符串来进行识别 2.方式一 在前端中添加{% csrf_token %},前端ajax发送的data数据中加上: csrfmiddlewaretok