跨域ajax两次请求 一次为option(复杂请求)

原因:

1,跨域,2,请求为复杂请求:

    1、请求方法不是GET/HEAD/POST

    2、POST请求的Content-Type并非application/x-www-form-urlencoded, multipart/form-data, 或text/plain

    3、请求设置了自定义的header字段

解决办法:

  1,改为简单请求(去掉header等)

  2.服务端设置:Access-Control-Max-Age

    注意:2并不会完全去掉预检查option请求,但是只会检查一次,后续请求在到达过期时间之前均不再进行option预请求。

资料:

XMLHttpRequest会遵守同源策略(same-origin policy). 也即脚本只能访问相同协议/相同主机名/相同端口的资源, 如果要突破这个限制, 那就是所谓的跨域, 此时需要遵守CORS(Cross-Origin Resource Sharing)机制。

那么, 允许跨域, 不就是服务端设置Access-Control-Allow-Origin: *就可以了吗? 普通的请求才是这样子的, 除此之外, 还一种叫请求叫preflighted request。

preflighted request在发送真正的请求前, 会先发送一个方法为OPTIONS的预请求(preflight request), 用于试探服务端是否能接受真正的请求,如果options获得的回应是拒绝性质的,比如404\403\500等http状态,就会停止post、put等请求的发出。

第一个OPTIONS的请求是由Web服务器处理跨域访问引发的。OPTIONS是一种“预检请求”,浏览器在处理跨域访问的请求时如果判断请求为复杂请求,则会先向服务器发送一条预检请求,根据服务器返回的内容浏览器判断服务器是否允许该请求访问。如果web服务器采用cors的方式支持跨域访问,在处理复杂请求时这个预检请求是不可避免的。

查询代码发现,我们的web服务器确实采用的是cors来解决跨域访问的问题,并且我们在header中添加了自定义参数,导致我们的每次请求都为复杂请求,从而产生了每次请求都会发送两条请求的现象。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值