jquery的AJAX GET请求执行两次

Question

我有一个是在按钮的点击执行以下的AJAX请求：

<a href="javascript:test()"><img src="css/images/test.png"></a> 

function test(){ 
    console.debug("*"); 

    $.ajax({ 
     type: "GET", 
     dataType: "json", 
     url: '/path/to/url', 
     success: function(data){ 
      console.debug("**"); 
     }, 
     error: function(jqXHR, status, error){ 
      console.debug("*** " + status + " : " + error + " : " + jqXHR.status); 
     }, 
     cache: false 
    }); 
} 

该请求的响应时间为大约30秒返回。但是，该请求由服务器接收并执行两次，正如apache日志所看到的那样。请求的时间戳相隔30秒，但请求是相同的（例如？_ = 1363692320782）。点击响应函数被调用一次，错误回调被调用一次（正好在初始请求后60秒），尽管apache响应是200.

此问题已在Samsung Galaxy S2，android版本2.3中复制。 5在phonegap应用程序中。

更新 - 加入Apache日志从注释条目下面

1.2.3.4 - - [19/Mar/2013:14:07:59 +0000] "GET /pcapi/records/dropbox/08342hjg9gpqm7g/?_=1363702072225 HTTP/1.1" 200 11139 "-" "Mozilla/5.0 (Linux; U; Android 2.3.5; en-gb; GT-I9100 Build/GINGERBREAD) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1" 
1.2.3.4 - - [19/Mar/2013:14:08:29 +0000] "GET /pcapi/records/dropbox/08342hjg9gpqm7g/?_=1363702072225 HTTP/1.1" 200 11139 "-" "Mozilla/5.0 (Linux; U; Android 2.3.5; en-gb; GT-I9100 Build/GINGERBREAD) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1" 

更新 - 亚行logcat

I/Web Console(16747): * at file:///android_asset/www/js/mobile.js:1769 
I/Web Console(16747): *** error : : 0 at file:///android_asset/www/js/mobile.js:1779 

更新 - TCP/IP监控

把请求通过TCP/IP监视器两个请求都发送了两个200响应。

Answer 1

我打这个确切的问题与Android 2.3.5运行我的应用。我只能断定webview在超时后重试请求。我无法找到影响超时时间的方法。

最后，我重写了代码，以便初始请求在服务器上分离出异步进程并立即返回。然后，从页面上的setTimer中，我将检查服务器进程的状态（再次，立即返回）。状态为“完成”时，该页面将移至下一步。

我希望有帮助。我当然明白你对此的失望。我花了几天时间与它斗争。

编辑：这可能是我向异步解决方案发送的文章。我相信，这里所说的问题是同一个：

XmlHttpRequest double posting issue in Android

Answer 2

如果您在此处定义的网址路径url: '/path/to/url'是文件夹而不是特定文件，请尝试添加像这样的尾部斜杠url: '/path/to/url/'。

未指定文件时会发生什么情况：Apache Web服务器使用新URL（带有斜线）向AJAX客户端发送301重定向，以便客户端向正确的URL发出新请求。

看到类似的问题在这里发布：jQuery $.ajax() executed twice?

请参阅Apache文档参考这里：http://httpd.apache.org/docs/2.0/mod/mod_dir.html#directoryslash

Answer 3

我已经试过这一个在我的移动网站开发的唯一的问题是在我的表格，然后在我的JavaScript的，我宣布

$("#button_submit").onclick(function(){ 
    //ajax request here 
}); 

，也不要忘了删除窗体属性，如动作和方法，如果您正在使用AJAX

我希望它能帮助你^ _^

Answer 4

有关使用beforeSend:和complete:和.ajaxSend() + ajaxSuccess()，还尝试用cache: true

$(document).ajaxSend(function (event, jqxhr, settings) { 
    console.log("triggered ajaxSend !"); 

    if (submission_active == true) { 
     jqxhr.abort(); 
    } 

    submission_active = true; 
}); 

$(document).ajaxSuccess(function (event, xhr, settings) { 
    console.log("triggered ajaxSuccess !"); 
    submission_active = false; 
}); 

$.ajax({ 
    type: "GET", 
    dataType: "json", 
    timeout: 30000, 
    cache: false, 
    url: '/path/to/url', 
    success: function(data){ 
     console.debug("**"); 
    }, 
    beforeSend: function(xhr, opts){ 
     if(submission_active == true){ 
      xhr.abort(); 
     } 

     submission_active = true; 
    }, 
    complete: function(){ 
     submission_active = false; 
    } 
    error: function(jqXHR, status, error){ 
     console.debug("*** " + status + " : " + error); 
    } 
}); 

Answer 5

Click事件被触发两次。以下代码修复了这个问题。

$('.selector').unbind('click').bind('click', function() { 
//... 
// Ajax code 
//... 
}); 

Answer 6

你面对的通常被称为问题“反弹”它也面临着电子开关，当你按下和释放按钮开关被触发两次，所以你需要或者设定的延迟功能或取消绑定它，一旦你完成你的点击。

你可以使用本Alman的油门脚本去抖你的点击，它在防止发生多个AJAX调用非常有用的，结合起来，与延迟，你的问题应该是固定的

http://benalman.com/code/projects/jquery-throttle-debounce/examples/debounce/

  var debounceClick = $.debounce(test, 1000); 
      function test() { 
       console.debug("*"); 
       $.ajax({ 
        type: "GET", 
        dataType: "json", 
        url: '/path/to/url', 
        success: function(data){ 
         console.debug("**"); 
        }, 
        error: function(jqXHR, status, error){ 
         console.debug("*** " + status + " : " + error + " : " + jqXHR.status); 
        }, 
        cache: false 
       }); 
      } 

现在从链接调用debounceClick函数来解决您的问题。

另外，您也可以使用简单的普通的JavaScript，而不节流插件也能达到你的结果：

  var timeout; 
      function test(){ 
       console.debug("*"); 
       $.ajax({ 
        type: "GET", 
        dataType: "json", 
        url: '/path/to/url', 
        success: function(data){ 
         console.debug("**"); 
        }, 
        error: function(jqXHR, status, error){ 
         console.debug("*** " + status + " : " + error + " : " + jqXHR.status); 
        }, 
        cache: false 
       }); 
      } 

      function click() { 
       if(timeout) { 
         clearTimeout(timeout); 
       } 
       timeout = setTimeout(test, 1000); 
      } 

在本例中，点击（）函数绑定到你的链接。

Answer 7

<a href="javascript:test()"> 

那是你的问题。如果你打算使用jQuery，使用他们的CSS选择器!!!!!!!!该href：JavaScript的东西跨越浏览器/设备的越野车。

Answer 8

听起来更像事件传播的问题。我看到了类似的症状（尽管在ios上），并且涉及触发'点击'事件的'触发'和'touchend'事件。你有没有尝试这样的事情：

$("a").click(function (e) { 
    e.preventDefault(); 
    alert('Clicked'); 
    test(); 
}); 

希望这有助于！
欢呼
jd

Answer 9

我面临同样的问题，我绑定点击事件上的提交按钮和ajax运行两次。 代替结合的事件中，我使用onClick方法上的按钮等下面

<button onclick"myProcess()"></button> 

和它解决了我的问题。