jQuery AJAX调用中的内存泄漏问题

Question

我编写了一个小型的聊天框小部件，它每秒运行一个ajax调用，以获取已发布的新消息。问题在于，它会泄漏内存，在仅仅打开15分钟左右后，它就会使我的浏览器（Firefox）崩溃。

很可能是我自己的问题，因为我是相对新手，我肯定错过了什么，或者没有取消设置我的变量等等。

var chat = {}
chat.fetchMessages = function() {
    $.ajax({
        url: '/chat_ajax.php',
        type: 'post',
        data: { method: 'fetch'},
        success : function(data) {
            $('#chat .messages').html(data);
            $("#chat").scrollTop($("#chat")[0].scrollHeight);
        }
    });
}
chat.interval = setInterval(chat.fetchMessages, 1000);
chat.fetchMessages();

能否请有经验的开发者们帮我看一下（基础）代码，看看是否能找出内存泄漏的位置和我做错了什么？我需要取消设置某些变量或者其他操作吗？

非常感谢！

- Neil Hillman

---

jQuery的哪个版本？如果包括jQuery 1.9.1，是否仍然会出现这种情况？旧版本的jQuery有一个内部缓存，其中存储了简单的HTML字符串，当开发人员使用像上面那样的代码时，它会生成看似内存泄漏的东西，因为缓存从未被清除。 - Kevin B

我不理解的是 $('#chat .messages').html(data); 你总是通过 AJAX 请求获取整个聊天内容吗？我认为你应该只请求用户尚未阅读的部分，并将其附加到 .messages 中。否则，数据最终会变成一个巨大的文本。 - Onur Topal

Answer 1

< p >不要使用setInterval()来进行ajax请求，否则请求将无法同步。相反，应该使用setTimeout()，然后在逻辑等待期间，在complete回调中递归地初始化setTimeout()。

示例：

$(DoMyAjax); // start your ajax on DOM ready
function DoMyAjax() {
   $.ajax({ 
      complete: function() {
          // your logic here
          setTimeout(DoMyAjax, 1000);
      }
   });
}

- Brad M

---

这实际上会导致内存泄漏的倍增 - 现在每秒是兆字节而不是千字节！ - Megan Caithlyn

@NeilHillman 这是 Helga 所说的情况吗？根据上面的评论之一，jQuery 似乎会保留一个永远不会清除自身的 HTML 字符串缓存。 - ScottC