在项目中发现ajax中出现两次请求,OPTIONS请求和GET请求,获得的数据出错,因此想要去掉OPTIONS请求。ajax
ajax请求以下:跨域
ajaxRequestGet: function (lastPath, requestParams, successFun) { $.ajax({ headers: { 'GISTTOKEN': getToken() }, url : this.baseUrl+lastPath, type : "get", data: requestParams, success : function(data){ successFun(data); } }); },
查看到浏览器NetWork有两次请求,请求url同样:浏览器
查找缘由是浏览器对简单跨域请求和复杂跨域请求的处理区别。app
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等请求的发出。
那么, 什么状况下请求会变成preflighted request呢?
一、请求方法不是GET/HEAD/POST
二、POST请求的Content-Type并不是application/x-www-form-urlencoded, multipart/form-data, 或text/plain
三、请求设置了自定义的header字段post
上面请求中设置了自定义的headers字段,出现了option请求。把自定义headers字段删掉后,只剩下get请求:this
ajaxRequestGet: function (lastPath, requestParams, successFun) { $.ajax({ url : this.baseUrl+lastPath, type : "get", data: requestParams, success : function(data){ successFun(data); } }); },