如何擴展JQuery的ajax done（）方法？

Question

我有一個jQuery的AJAX功能是這樣的：

jQuery.ajax({ 
      url : '/blabla', 
      method : 'post', 
      data: { 
       bla : bla 
      } 
     }).done(function(data) { 
      // do lots of stuff 
     }); 

..我希望能夠增加一個檢查傳入完成回調函數的數據沒有在它session_timed_out值。假設我有許多與上面類似的功能，但他們都做不同的事情，但他們都需要檢查會話是否超時。有沒有適當的方法來擴展done（），以便它最初檢查超時？我試圖做這樣的事情，但它失敗：

var myAjax = function(options,callback){ 
    var defaults = {    
     done: function(data){ //hijack the success handler? 
      if(check(data)){  
       callback(data); 
      } 
     } 
    }; 
    jQuery.extend(options,defaults); 
    return jQuery.ajax(options); 
} 

當我使用此之前的作品一樣，這意味着支票不會被調用，因爲它似乎是由（）完成回調在實際取代擴展功能實現，我認爲是有道理的。所以我想知道是否有一種方法來「裝飾」或擴展done（）函數，以便首先檢查會話超時。或者我需要手動添加這個相同的會話檢查到我所有的ajax完成？

Answer 1

這段代碼覆蓋了jQuery ajax方法，因此您可以在成功返回時添加額外的檢查。

(function($) { 

    var yourCustomCheck = function(ajaxRes) { 
     // Do whatever you need and return a boolean 
    }; 

    var oldAjax = $.ajax; 
    $.ajax = function(opts) { 
     return $.Deferred(function() { 
      var _def = this; 

      oldAjax.call(this, opts).done(function(res) { 
       console.log("this is done first"); 
       if(yourCustomCheck.call(this, res)) _def.resolve(res); 
       else _def.reject("timeout"); 
      }).fail(function() { 
       _def.reject(); 
      }); 
     }) 
    } 

})(jQuery); 

在此之後，你可以使用$.ajax()正常..

$.ajax({ 
    ..... 
}).done(function(res) { 
    console.log("ok"); 
}).fail(function() { 
    console.log("no ok"); 
}); 

這裏是工作示例的jsfiddle：https://jsfiddle.net/jormaechea/kffyo7qL/1/

Answer 2

你可以鏈接一個超時檢查：

jQuery.ajax({ 
     url : '/blabla', 
     method : 'post', 
     data: { 
      bla : bla 
     } 
    }).then(timeoutCheck).then(function(data) { 
     // do lots of stuff 
    }, function(err) { 
     // handle error 
    }); 

    function timeoutCheck(data) { 
     if (check(data)) { 
      return data; 
     } else { 
      // return a rejected promise to turn fulfilled into reject 
      return jQuery.Deferred.reject(new Error("timeout")); 
     } 
    } 

---

或者，你可以把這個在自己的Ajax調用。

jQuery.ajaxT = function() { 
    return jQuery.ajax.apply(jQuery, arguments).then(timeoutCheck); 
} 

jQuery.ajaxT(...).then(function(results) { 
    // handle returned data here 
    // the timeoutCheck has already been done 
}, function(err) { 
    // handle any errors here 
}); 

然後，任何Ajax調用你jQuery.ajaxT()開始將自動地有timeoutCheck添加到它的承諾邏輯。如果ajax調用成功並且超時檢查通過，那麼該承諾將被履行。如果ajax調用成功並且超時檢查失敗，則承諾被拒絕。