如何处理大量AJAX请求(> 1000)

Question

我的应用程序正在从客户端的Google联系人API中获取用户的所有Google联系人。这通常导致1-2000个不同的JSON对象。当收到这些信息时，我的应用程序会遍历它们，重新格式化每个联系人对象，然后尝试通过POST请求将重新格式化的联系人对象保存到我的数据库中。这样做的结果是大量AJAX调用(1-2000)在客户端触发，但在其中5-10次调用之后就停止了。处理所有这些AJAX请求或同时保存这么多数据的最佳方法是什么？

下面是我当前代码的摘要版本：

// gContacts.length = 722

$(gContacts).each(function(index, contact) {

         // Reformat each contact object to fit into my database
         var newContact = {}
         newContact.title = // String
         newContact.emails = // Object featuring different emails
         newContact.phone_numbers = // Object featuring different phonenumbers

         // Save to Database via Backbone
                    var newContact = new App.Collections.Contacts()
                    newContact.create({
                        title           : newContact.title,
                        emails          : newContact.emails,
                        phone_numbers   : newContact.phone_numbers
                    }, {
                        success: function (response) {

                        },
                        error: function (model, xhr) {
                            var errors = $.parseJSON(xhr.responseText).errors
                            console.log(errors)
                        }
                    }) // End .save
}); // End of .each()

Answer 1

我会做一个服务器端的操作，需要一个完整的联系人对象列表。然后在客户端，只需格式化它们并将它们全部添加到数组中，一旦完成，就发送数组。你这样做会产生很多不必要的网络开销。

Answer 2

大多数现代浏览器都将同步请求限制为6 per domain。上述请求被阻塞，直到其中一个活动请求完成，为队列中的下一个请求释放一个连接。如果活动请求需要足够长的时间(读“太长”)，那么挂起的请求就会超时，就像您看到的那样。

要正确处理这一问题，您确实需要提交自己的请求管理代码。只在浏览器处理的同时发出尽可能多的请求。当请求完成、错误退出或超时时，发出下一个请求。这需要维护一个挂起请求的队列，并准确地检测请求何时完成或完成，但应该做到这一点。

您可能遇到的一个问题是，您的POST请求将与服务器上的所有其他请求竞争。例如，您可能已经注意到或者没有注意到，如果您打开另一个页面到您的网站，而这些帖子请求正在通过网络，您的网站从来没有加载，或加载非常缓慢。

正如其他人所说，将这些更新批次到单个请求中可能是一个更好的解决方案。