javascript - ajax 调用正在堆叠

Question

所以标题说明了发生的事情。我有一个 ajax 调用，如果成功，它会发出另一个 ajax 调用，但问题是在该调用完成之前，它已经发出了另一个 ajax 调用，并且 ajax 开始堆叠。我不使用异步，并使用php作为我的服务器语言。我的 ajax 的超时时间也是 5 秒 = 5000 毫秒。 因此，它会轮询服务器，同时等待，然后 javascript 执行新的 ajax 调用，甚至在另一个调用返回信息之前。

这是我的 jquery ajax 调用

 $.ajax({
                url: ("json/getfriends.php"),
                type: 'POST',
                data: {friendlist: friendsarray},
                async: false,
                timeout: 5000,  
                dataType: 'json',       
                success: function(data){                
                    $.each(data, function(i, val){
                        friendsarray.push(val);                 
                    });
                    setTimeout("friends();", 15000); //loops the ajax call

                },
                error: function(jqXHR, textStatus, errorThrown) 
                {
                    if (errorThrown['code'] == 101){
                        //time out, not data was received 
                        setTimeout("friends();", 15000); //loops the ajax call
                    }
                    else
                    {
                        console.log(errorThrown);
                    }
                }
            });

所以我的问题是如何停止 ajax 相互堆叠，或者如何使一个 ajax 调用仅在另一个调用带回数据后才进行。

so here is a image and the aftermath

my full javascript

Answer 1

底线是，您所显示的代码没有出现问题。

但是，full JavaScript您添加的有一个重大问题:

...
setTimeout(chat_check(), 20000);    
...

看到了吗？它立即从成功处理程序中运行 chat_check()。这不是一个好主意!

应该是这样的:

setTimeout(chat_check, 20000);

它将函数引用作为第一个参数传递，而不是函数结果。您可能希望对您的 friends() 调用应用相同的方法:

setTimeout(friends, 15000);

编辑

顺便说一句，我不确定您为什么使用 async: false，但这样做对于用户体验来说并不是很好，因为浏览器在请求期间将无响应。

使用默认的异步模式会更好:)