前端使用ajax时,自动请求了两次

最新推荐文章于 2024-07-16 06:25:14 发布
最新推荐文章于 2024-07-16 06:25:14 发布
阅读量1.9k 收藏 4
点赞数
分类专栏： 前端专栏 文章标签： 前端 ajax 两次请求
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/HX0326CSDN/article/details/113674458
版权

前端使用ajax时,自动请求了两次

如下
在这里插入图片描述
在这里插入图片描述

发生原因:
有跨域请求发生
必须要在跨域的情况下。
除GET、HEAD和POST(only with application/x-www-form-urlencoded, multipart/form-data, text/plain Content-Type)以外的跨域请求（我们可以称为预检(Preflighted)的跨域请求）。

之所以会发送2次请求，那是因为我们使用了带预检(Preflighted)的跨域请求。该请求会在发送真实的请求之前发送一个类型为OPTIONS的预检请求。预检请求会检测服务器是否支持我们的真实请求所需要的跨域资源，唯有资源满足条件才会发送真实的请求。比如我们在请求头部增加了authorization项，那么在服务器响应头中需要放入Access-Control-Allow-Headers，并且其值中必须要包含authorization，否则OPTIONS预检会失败，从而导致不会发送真实的请求。

本地使用127.0.0.1请求页面, 页面中使用了本地 ip (192.168) 请求后台导致的

解决办法:
1.使用同一域名访问

架构师Rakic
关注
专栏目录
ajax发送请求会请求两次,jquery ajax发送请求两次
weixin_42487737的博客
08-05 1213
当我将值发送到处理页面时出现问题 值被多次发送 我在jQuery函数中更改为.on()，但是同一问题 有些运行没有问题，但更新和删除次重复jquery ajax发送请求两次阿贾克斯/* Start Update User From Moadl Bootstrap */$('#EditForm').submit(function(event){var that = $(this),url = tha...
前后端分离ajax出现两次请求,前后端分离，ajax跨域请求，2次请求
weixin_31485835的博客
08-05 559
参考https://blog.csdn.net/charleslei/article/details/51906635https://blog.csdn.net/kejmln/article/details/51350777开发过程中，如果出现类似 “Origin ****** is not allowed by Access-Control-Allow-Origin.” 的错误，则可能是由于js...
一次ajax调用，却发送了二次http请求（一次为请求方法为option，一次为正常请求）
hl_java的专栏
09-04 7894
直接上证据，截图来自于chrowm浏览器-开发者工具-network 会发现其中一次请求 Method是OPTIONS 另外一次是正常请求 原因如下： 浏览器对复杂跨域请求的处理，在发送真正的请求前, 会先发送一个方法为OPTIONS的预请求(preflight request), 用于试探服务端是否能接受真正的请求，如果options获得的回应是拒绝性质的，比如404\403...
Web 中POST为什么会发送两次请求
最新发布
拥有必珍惜
07-16 1716
我们在做Web开发时，经常会使用浏览器F12查看请求参数是否正确，但是会发现POST请求，一个地址发送了两次请求，第一次是OPTIONS，第二次才是POST请求，下面我们将就是问题进行深入分析。POST请求发送两次的问题看似简单，实际上涉及了很多知识点，包括浏览器的重试机制、跨域请求的预检机制、表单的自动提交、服务器配置问题以及前端代码中的逻辑错误等。
ajax中出现两次请求
fwk19840301的博客
05-28 1万+
在项目中发现ajax中出现两次请求，OPTIONS请求和GET请求，得到的数据出错，所以想要去掉OPTIONS请求。ajax请求如下： ajaxRequestGet: function (lastPath, requestParams, successFun) { $.ajax({ headers: { ...
关于ajax中出现2次请求的原因及解决办法
qq_42089654的博客
11-29 1万+
前言 在项目中发现ajax中出现两次请求，OPTIONS请求和POST请求，由于在上传数据的时候，后台可能2次都有反应，因此会造成数据上的错误。 1，具体表现如下： 查找原因是浏览器对简单跨域请求和复杂跨域请求的处理区别。 2，原因如下：  浏览器对复杂跨域请求的处理，在发送真正的请求前, 会先发送一个方法为OPTIONS的预请求(preflight request), 用于试探服务端...
前端 发送请求时，同时出现两次请求
weixin_42340514的博客
09-04 1万+
1事故情况：在前端ajax请求数据的时候，有时候会向后台一次性发送两次请求，，这两次请求第一次无返回数据，第二次才会返回正确数据。 2事故原因：原来对于跨域，有两种不同的请求类型。分别为简单跨域请求和复杂跨域请求(带预检的跨域请求)。 3复杂跨域： 非简单请求是那种对服务器有特殊要求的请求，比如请求方法是PUT或DELETE，或者Content-Type字段的类型是application/j...
一次ajax调用，发送了两次请求（一次为请求方法为option，一次为正常请求）
热门推荐
weixin_38958405的博客
07-12 2万+
在项目了开发时遇见一个奇怪的现象，就是我在js里面掉了一次ajax请求，在浏览器network那边查询到的却是发送了两次请求，第一次的Request Method参数为OPTIONS,第二次的Request Method为我正常设定的POST。 在参考了：https://blog.csdn.net/cc1314_/article/details/78272329这边博客以后终于找到了原因。 浏...
layui下ajax一次请求回调两次的解决办法【个人向】
qq_44819109的博客
10-08 884
问题：layui中一次ajax请求回调两次。 设置一个变量，调用前设置为true，调用时设置为false，通过if调控。
js每隔5分钟执行一次ajax请求的实现方法
10-26
标题中提到的知识点是如何每隔5分钟执行一次AJAX请求，这是一个在前端JavaScript开发中常见的需求，主要用于实现定时更新服务器数据、定时轮询等。在JavaScript中，实现周期性任务通常有几种方法，这里主要涉及到的...
ajax一次请求多条记录,Jquery 一次处理多个ajax请求的代码
weixin_28811289的博客
08-06 1043
Jquery 一次处理多个ajax请求的代码复制代码 代码如下:$(document).ready(function () {$('#getsetgo').click(function () {$.when($.ajax("page1.php"), $.ajax("page2.php")).done(function(a1, a2){$('#id1').html(a1[0]);$('#id2')....
ajax请求一次却执行两次.zip
12-25
ajax请求一次却执行两次.zip 能看到这里的同行们肯定是遇到了chrome f12发现访问一次ajax,得到了两次返回.我来告诉你原理和如何让后台只返回一次的方法
【封装原生ajax请求】也没那么复杂嘛！
小陈的博客
07-21 362
就代表请求发送成功，并且服务器端进行了正确的处理，此时客户端就可以根据服务器返回的数据进行下一步操作了。至此，我们就完成了一个简易版原生Ajax的封装，又多了一项前端技能呢~当声明了xhr对象后，我们就可以着手打开请求和发送请求的工作了。等于其他状态码，我们就需要处理异常，告诉客户端本次请求发送失败。格式的字符串，为了便于回调函数更方便的使用这些数据，我们需要使用。请求，得到服务器返回的数据后，异步渲染在页面上。请求来说，就简单多了，发送请求通过调用。，请求参数，成功之后的回调函数等…...
前端接口出现两次请求--认识简单请求和非简单请求
_web_Z的博客
07-15 3639
所有跨域的js在提交post请求的时候，如果服务端设置了可跨域访问 public static function setCrossDomain() { header(‘Access-Control-Allow-Origin: *’); header(“Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept”); header(‘Access-Control-Allow-Methods: GET, POST..
为什么一次ajax调用会发送两次请求？
Dontla的博客
11-26 3305
引用文章：一次ajax调用，发送了两次请求（一次为请求方法为option，一次为正常请求）
JAVA解决OPTIONS请求问题：跨域时ajax发送两次请求
WillorBoy的博客
06-26 1465
这是在跨域的情况下，浏览器发起"复杂请求"时主动发起的。跨域共享标准规范要求，对那些可能对服务器数据产生副作用的 HTTP 请求方法（特别是 GET 以外的 HTTP 请求，或者搭配某些 MIME 类型的 POST 请求），浏览器必须首先使用 OPTIONS 方法发起一个预检请求（preflight request），从而获知服务端是否允许该跨域请求。在进行HTTP请求时，可能会遇到一种叫做OPTIONS的请求，它是一种预检请求，用于在发送实际请求之前，检查服务器是否允许该请求。3.利用filter。
$.ajax 发送请求,Ajax 发送请求两次
weixin_33745006的博客
08-05 492
正如我在标题中所描述的，ajax 同时发送两个请求。仅当“async”参数设置为“true”时才会发生这种情况。当它是“false”时，就没有问题。我正在阻止通过以下方式重新加载页面：$(document).ready(function() {$(document).on('submit', 'form', function() {showBusyIndicator();addTask();ret...
[前后端分离] 前端发送跨域API请求，每次访问会发送两次请求OPTIONS问题
LeoSong121的博客
08-28 5787
最近在做前后端分离的项目，项目部署到azure后，发现前端访问后端API的时候，每次都会发送两次请求 第一次是OPTIONS的请求，然后才是正常的请求，。这个问题十分有意思。 查阅资料得到的结论是： 第一个OPTIONS的请求是由Web服务器处理跨域访问引发的。 OPTIONS是一种“预检请求”，浏览器在处理跨域访问的请求时如果判断请求为复杂请求，则会先向服务器发送一条预检请求，根据服务器...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值