最近一哥們在做一個Ajax長連接的項目,頁面需要和伺服器保持長連接,而且在連接超時後需要重新請求連接,過程中他問我要用到什麼,我也是想都沒想就告訴他用jQuery。 jQuery不是有ajaxSuccess ajaxError這些物件嗎,在請求完成或要求失敗後重新請求不就好了。
但後來他告訴我說沒有用 jQuery,自己手寫的XMLhttprequest 。他告訴我說,一開始是用jquery寫的,而且在測試過程中也沒有出現問題。但在後來無意間發現,在頁面開啟的時候久了之後,瀏覽器資源竟然佔用非常高導致記憶體不足而崩潰了。後來抓包分析發現,每次jquery的Ajax請求都會創建一個xmlHttprequest對象,理論上講,長連接的請求是一個無限遞歸,請求數量是非常大的,但是由於每次請求都會建立一個新的xmlhttprequest,而且jquery不會自動回收資源,所以導致了記憶體溢位。
透過查看jquery API,發現jquery還有一個 complete對象,是請求完成後回呼函數 (請求成功或失敗之後均調用)。 同時有兩個參數XMLHttpRequest, textStatus。所以,我們只需要在請求完成後,將傳回的XMLHttprequest物件手動回收即可,程式碼如下: