Pattern JS ajax riutilizzabile (jquery)

Question

Mi piacerebbe sapere se esiste un approccio migliore alla creazione di oggetti ajax riutilizzabili per jquery.

Questo è il mio codice non testato.

var sender = { 
    function ajax(url, type, dataType, callback) { 
     $.ajax({ 
      url: url, 
      type: type, 
      dataType: dataType, 
      beforeSend: function() { 
       onStartAjax(); 
      }, 
      error: function(XMLHttpRequest, textStatus, errorThrown) { 
       callback.failure(XMLHttpRequest, textStatus, errorThrown); 
      }, 
      success: function(data, textStatus) { 
       callback.success(data, textStatus); 
      }, 
      complete: function (XMLHttpRequest, textStatus) { 
       onEndAjax(); 
      } 
     }); 
    }, 
    function onStartAjax() { 
     // show loader 
    }, 
    function onEndAjax() { 
     // hide loader 
    } 
}; 


<script type="text/javascript"> 
    var callback = { 
     success: function(data, textStatus) { 
      $('#content').html(data); 
     }, 
     failure: function(XMLHttpRequest, textStatus, errorThrown) { 
      alert('Error making AJAX call: ' + XMLHttpRequest.statusText + ' (' + XMLHttpRequest.status + ')'); 
     } 
    } 

    sender.ajax(url, type, dataType, callback); 

</script> 

Answer 1

È possibile impostare le opzioni di base che si hanno sempre separatamente.

per esempio se si utilizza sempre la stessa cosa qui:

type: type, 
    dataType: dataType, 

per quei tipi, è possibile impostare separatamente.

Ecco come si fa quel tipo di cosa:

$.ajaxSetup({ 
    type: "POST", 
    contentType: "application/json; charset=utf-8", 
    data: "{}" 
}); 

ora quelle sono impostati e si possono semplificare le chiamate Ajax individuali.

EDIT:

NOTA: L'impostazione dei parametri a $ .ajax sovrascrivere queste. Quindi la preselezione di "dati" a una stringa JSON vuota è sicura e desiderata. In questo modo, qualsiasi chiamata $ .ajax che specifica un parametro di dati funzionerà come previsto, dal momento che l'impostazione predefinita non verrà utilizzata. Ciò consente di evitare problemi che possono essere difficili da trovare su un sito distribuito.

Answer 2

Probabilmente andrei su tutte le furie e ho creato un oggetto Ajax.

var ajax = new MySuperAjax(url, data); 
ajax.onComplete = function(){} 

o simile. Sembra che tu abbia una via di mezzo tra una funzione che ha alcune impostazioni predefinite che si estende con quelle che hai dentro e un oggetto per essa.

Answer 3

Ecco quello che ho fatto: l'utilizzo

var ajaxclient = (function (window) { 

    function _do(type, url) 
    { 
     return $.ajax({ 
      url:url, 
      type:type, 
      dataType:'json', 
      beforeSend: _onStartAjax     
     }).always(_onEndAjax); 
    } 

    function _onStartAjax() 
    { 
     console.log("starting ajax call"); 
    } 

    function _onEndAjax() 
    { 
     console.log("finished ajax call"); 
    } 

    return { 
     do:_do 
    } 
}(this)); 

Esempio:

ajaxclient.do("get","http://...").done(function(data) {console.log(data);})