Javascript jQuery Ajax 请求在没有发送的情况下被取消

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/7577275/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 02:47:49  来源:igfitidea点击:

jQuery Ajax requests are getting cancelled without being sent

javascriptjqueryajax

提问by Graham Wheeler

I am trying to hook up a script to Microsoft's World-Wide Telescope app. The latter listens on port 5050 for commands. It is running on the same machine as the browser (Chrome right now, but as far as I can tell the behavior is the same with Firefox 7 and IE 9).

我正在尝试将脚本连接到 Microsoft 的 World-Wide Telescope 应用程序。后者在端口 5050 上侦听命令。它与浏览器在同一台机器上运行(现在是 Chrome,但据我所知,Firefox 7 和 IE 9 的行为是相同的)。

I am sending a "Access-Control-Allow-Origin: *" header with the original html file to try to eliminate XSS restrictions as my problem.

我正在发送带有原始 html 文件的“Access-Control-Allow-Origin:*”标头,以尝试消除 XSS 限制作为我的问题。

My code to access WWT is as follows:

我访问WWT的代码如下:

$.ajax({
    type: 'POST',
    url: url,
    data: data,
    crossDomain: true,
    success: success,
    dataType: dataType
});

url in this case is "http://127.0.0.1:5050/layerApi.aspx?cmd=new&..." (obviously ... is shorthand here for some additional parameters).

在这种情况下,url 是“http://127.0.0.1:5050/layerApi.aspx?cmd=new&...”(显然...这里是一些附加参数的简写)。

Looking at the network diagnostics in Chrome, I can see this:

查看 Chrome 中的网络诊断,我可以看到:

Request URL:http://127.0.0.1:5050/layerApi.aspx?cmd=new&...
Request Headersview source
Accept:application/xml, text/xml, */*; q=0.01
Content-Type:application/x-www-form-urlencoded
Origin:http://gwheeler4
Referer:http://gwheeler4/conceptconnect.html
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/535.1 (KHTML, like Gecko) Chrome/14.0.835.186 Safari/535.1

The request is going out - I see WWT make a new layer. However, I don't get a callback. If I add an error callback that gets called, but the error property on the jqXHR object is just "error" and status is 0. If I look at the network request in Chrome I see "(cancelled)" as the status and no response.

请求正在发出 - 我看到 WWT 创建了一个新层。但是,我没有收到回调。如果我添加一个被调用的错误回调,但 jqXHR 对象上的错误属性只是“错误”并且状态为 0。如果我在 Chrome 中查看网络请求,我会看到“(已取消)”作为状态并且没有响应.

If I take that same URL and paste it in a new browser tab, I can see that the response is the expected XML.

如果我使用相同的 URL 并将其粘贴到新的浏览器选项卡中,我可以看到响应是预期的 XML。

Of course, a difference here is that this is a GET not a POST, but I've tried that in my script and it makes no difference.

当然,这里的不同之处在于这是一个 GET 而不是 POST,但我已经在我的脚本中尝试过,它没有任何区别。

I'm pretty stumped by this and would appreciate any fresh ideas.

我对此感到非常困惑,并会欣赏任何新的想法。

回答by Kazetsukai

If anyone else runs into this, the issue we had was that we were making the ajax request from a link, and not preventing the link from being followed. So if you are doing this in an onclickattribute, make sure to return false;as well.

如果其他人遇到这个问题,我们遇到的问题是我们从链接发出 ajax 请求,而不是阻止链接被跟踪。因此,如果您在onclick属性中执行此操作,请确保也这样做return false;

回答by Ben Walding

If you're using Chrome you can't see enough information in the standard Chrome networking panel to determine the root cause of a (canceled)request.

如果您使用的是 Chrome,则无法在标准 Chrome 网络面板中看到足够的信息来确定(canceled)请求的根本原因。

You need to use chrome://net-internals/#eventswhich will show you the gory detail of the request you are sending - including hidden redirects / security information about cookies being sent etc.

您需要使用chrome://net-internals/#eventswhich 将向您显示您发送的请求的详细信息 - 包括有关正在发送的 cookie 的隐藏重定向/安全信息等。

e.g. the following shows a redirect I wasn't seeing in the network trace - caused by my cookies not being sent cross sub-domain:

例如,以下显示了我在网络跟踪中没有看到的重定向 - 由于我的 cookie 没有被跨子域发送:

t=1374052796448 [st=  1]   +URL_REQUEST_START_JOB  [dt=261]
                            --> load_flags = 143540481 (DO_NOT_SAVE_COOKIES | DO_NOT_SEND_AUTH_DATA | DO_NOT_SEND_COOKIES | ENABLE_LOAD_TIMING | MAYBE_USER_GESTURE | REPORT_RAW_HEADERS | VALIDATE_CACHE | VERIFY_EV_CERT)
                            --> method = "GET"
                            --> priority = 2
                            --> url = "https://...."
...
t=1374052796708 [st=261]        HTTP_TRANSACTION_READ_RESPONSE_HEADERS
                                --> HTTP/1.1 302 Moved Temporarily
                                    Content-Type: text/html
                                    Date: Wed, 17 Jul 2013 09:19:56 GMT
...
t=1374052796709 [st=262]     +URL_REQUEST_BLOCKED_ON_DELEGATE  [dt=0]
t=1374052796709 [st=262]        CANCELLED
t=1374052796709 [st=262]   -URL_REQUEST_START_JOB
                            --> net_error = -3 (ERR_ABORTED)

回答by Black Mamba

In my case I was having type='submit'so when I was submitting the form the page was reloading before the ajax hit going so a simple solution was to have type="button". If you don't specify a type it's submitby default so you've gotta specify type="button"

在我的情况下,type='submit'当我提交表单时,页面会在 ajax 命中之前重新加载,因此一个简单的解决方案是将type="button". 如果您不指定类型,则submit默认为默认类型,因此您必须指定type="button"

type='submit'=> type='button'

type='submit'=> type='button'

回答by Felipe Sodre Silva

I had a similar problem. In my case, I'm trying to use a web service on a apache server + django (the service was written by myself). I was having the same output as you: Chrome says it was cancelled while FF does it okay. If I tried to access the service directly on the the browser instead of ajax, it would work as well. Googling around, I found out that some newer versions of apache weren't setting the length of the response correctly in the response headers, so I did this manually. With django, all I had to do was:

我有一个类似的问题。就我而言,我正在尝试在 apache 服务器 + django 上使用 Web 服务(该服务是我自己编写的)。我和你有同样的输出:Chrome 说它被取消了,而 FF 没问题。如果我尝试直接在浏览器而不是 ajax 上访问该服务,它也可以正常工作。谷歌搜索,我发现一些较新版本的 apache 没有在响应标头中正确设置响应的长度,所以我手动执行了此操作。使用 Django,我所要做的就是:

response['Content-Length'] = len(content)

If you have control over the service you are trying to access, find out how to modify the response header in the platform you are using, otherwise you'd have to contact the service provider to fix this issue. Apparently, FF and many others browsers are able to handle this situation correctly, but Chrome designers decided to do it as specified.

如果您可以控制您尝试访问的服务,请了解如何在您使用的平台中修改响应标头,否则您必须联系服务提供商来解决此问题。显然,FF 和许多其他浏览器能够正确处理这种情况,但 Chrome 设计者决定按规定去做。

回答by RedEight

I had a similar issue. Using chrome://net-internals/#events I was able to see that my issue was due to some silent redirect. My get request was being fired in an onload script. The url was of the form, "http://example.com/inner-path" and the 301 was permanently redirecting to "/inner-path". To fix the issue I just changed the url to "/inner-path" and that fixed the issue. I still don't know why a script that worked a week ago was suddenly giving me issue... Hope this helps someone

我有一个类似的问题。使用 chrome://net-internals/#events 我能够看到我的问题是由于一些静默重定向。我的 get 请求在 onload 脚本中被触发。url 的格式为“ http://example.com/inner-path”,301永久重定向到“/inner-path”。为了解决这个问题,我只是将 url 更改为“/inner-path”并解决了这个问题。我仍然不知道为什么一周前工作的脚本突然给我带来了问题......希望这对某人有所帮助

回答by contactmatt

(Using Web Forms ASP.NET)

(使用 Web 窗体 ASP.NET)

My issue was I was trying to fire Ajax off the click event of a submit button that had a server side click event setup. I had to make the button just a simple button (i.e. <input type="button">)

我的问题是我试图从具有服务器端单击事件设置的提交按钮的单击事件中触发 Ajax。我不得不让按钮只是一个简单的按钮(即<input type="button">

回答by Hannele

Expanding on @Kazetsukai's answer, you may run into this problem if you are making your AJAX request from the user clicking on a link.

扩展@Kazetsukai 的答案,如果您从用户单击链接发出 AJAX 请求,则可能会遇到此问题。

If you set up your link like so:

如果您像这样设置链接:

<a href="#" onclick="soAjax()">click me!</a>

And then a javascript handler like the following:

然后是一个 javascript 处理程序,如下所示:

soAjax() {
    $.ajax({ ... all your lovely parameters ... });       
}

To prevent your browser from following the link and cancelling any requests in progress, you should add return falseor e.preventDefault()to stop the click event from propagating:

为了防止您的浏览器点击链接并取消任何正在进行的请求,您应该添加return falsee.preventDefault()停止传播点击事件:

soAjax() {
   $.ajax({ ... etc ... });
   return false;
}

Or:

或者:

soAjax(e) {
   $.ajax({ ... etc ... });
   e.preventDefault();
}

回答by Reza

I have had the same problem, for me I was creating the iframe for temporary manner and I was removing the iframe before the ajax become completes, so the browser would cancel my ajax request.

我遇到了同样的问题,对我来说,我正在以临时方式创建 iframe,并且我在 ajax 完成之前删除了 iframe,因此浏览器会取消我的 ajax 请求。

回答by AnkitK

Two possibilities are there when AJAX request gets dropped (if not Cross-Origin request):

当 AJAX 请求被丢弃时有两种可能性(如果不是跨域请求):

  1. You are not preventing the element's default behavior for the event.
  2. You set timeout of AJAX too low, or network/application backend server is slow.
  1. 您没有阻止元素对事件的默认行为。
  2. 您将 AJAX 的超时设置得太低,或者网络/应用程序后端服务器很慢。

Solution for 1): Add return false;or e.preventDefault();in the event handler.

1) 的解决方案:在事件处理程序中添加return false;e.preventDefault();

Solution for 2): Add timeout option while forming the AJAX request. Example below.

2) 的解决方案:在形成 AJAX 请求时添加超时选项。下面举例。

$.ajax({
    type: 'POST',
    url: url,
    timeout: 86400,
    data: data,
    success: success,
    dataType: dataType
});

For Cross-origin requests, check Cross-Origin Resource Sharing (CORS) HTTP headers.

对于跨域请求,请检查跨域资源共享 (CORS) HTTP 标头。

回答by ptutt

I got this error when making a request using http to a url that required https. I guess the ajax call is not handling the redirection. This is the case even with the crossDomain ajax option set to true (on JQuery 1.5.2).

使用 http 向需要 https 的 url 发出请求时出现此错误。我猜 ajax 调用没有处理重定向。即使将 crossDomain ajax 选项设置为 true(在 JQuery 1.5.2 上)也是如此。