17

我有以下通过单击按钮执行的 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"

更新-亚行日志猫

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 响应。

4

9 回答 9

6

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

当未指定文件时，Apache Web 服务器会使用新 URL（带有尾部斜杠）向 AJAX 客户端发送 301 重定向，因此客户端会向正确的 URL 发出新请求。

请参阅此处发布的类似问题：jQuery $.ajax() 执行了两次？

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

于 2013-03-19T12:44:53.247 回答
6

我在 Android 2.3.5 上运行的应用程序遇到了这个确切的问题。我只能得出结论，webview 在超时后重试了请求。我找不到影响超时持续时间的方法。

最后，我重写了代码，使得初始请求在服务器上分离出一个异步进程并立即返回。然后，从页面上的 setTimer 中，我将检查服务器进程的状态（同样，立即返回）。当状态为“完成”时，页面将移动到下一步。

我希望这会有所帮助。我当然理解你对此的不满。我花了几天时间自己与它作斗争。

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

Android中的XmlHttpRequest双重发布问题

于 2013-03-25T20:22:26.803 回答
3

beforeSend:使用and complete:AND .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);
    }
});
于 2013-03-21T17:45:32.747 回答
2

我已经在我的移动网站上尝试过这个，唯一的问题是在我的表单中，然后在我的 javascript 上我声明

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

如果您使用的是ajax，也不要忘记删除动作和方法等表单属性

希望对你有帮助^_^

于 2013-03-21T13:04:22.993 回答
2

点击事件被触发两次。下面的代码解决了这个问题。

$('.selector').unbind('click').bind('click', function () {
 //...
 // Ajax code
 //...
});
于 2013-03-25T21:55:08.030 回答
1 
 <a href="javascript:test()">

那是你的问题。如果您要使用 jquery，请使用他们的 css 选择器！！！！！！！！！那 href:javascript 的东西在浏览器/设备上是错误的。

于 2013-03-26T22:31:41.550 回答
1

听起来更像是事件传播的问题。我看到了类似的症状（尽管在 ios 上），它归结为 'touchstart' 和 'touchend' 事件都触发了 'click' 事件。你有没有尝试过这样的事情：

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

希望这可以帮助！
干杯
JD

于 2013-03-27T23:08:55.163 回答
0

您面临的问题通常称为“弹跳”，它也涉及电子设备中的开关，当您按下并释放按钮时，开关会触发两次，因此您需要为该功能设置延迟或取消绑定完成与您的点击。

您可以使用 Ben 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);
            }

在此示例中，将 click() 函数绑定到您的链接。

于 2013-03-26T04:59:25.430 回答
0

我遇到了同样的问题，我在提交按钮上绑定了点击事件，ajax 运行了两次。我没有绑定事件，而是使用onClick按钮上的方法，如下所示

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

它解决了我的问题。

于 2014-11-28T11:15:48.733 回答