"Si un trabajador quiere hacer bien su trabajo, primero debe afilar sus herramientas." - Confucio, "Las Analectas de Confucio. Lu Linggong"
Página delantera > Programación > ¿Cómo secuenciar las solicitudes de Ajax para un control óptimo?

¿Cómo secuenciar las solicitudes de Ajax para un control óptimo?

Publicado el 2024-11-03
Navegar:860

How to Sequence Ajax Requests for Optimal Control?

Secuenciación de solicitudes Ajax

Al iterar a través de una colección y realizar llamadas Ajax individuales para cada elemento, es esencial controlar la secuencia para evitar sobrecarga del servidor y congelación del navegador. Si bien se pueden emplear iteradores personalizados, hay soluciones más elegantes disponibles.

jQuery 1.5

En jQuery 1.5 y superiores, el complemento $.ajaxQueue() aprovecha $ .Deferred, $.queue() y $.ajax() para gestionar la secuenciación de solicitudes y proporcionar una promesa que se resuelve al completarse la solicitud.

Implementación:

var jqXHR,
    dfd = $.Deferred(),
    promise = dfd.promise();

ajaxQueue.queue( doRequest );

promise.abort = function( statusText ) {
  if ( jqXHR ) {
    return jqXHR.abort( statusText );
  }
  var queue = ajaxQueue.queue(),
      index = $.inArray( doRequest, queue );
  if ( index > -1 ) {
    queue.splice( index, 1 );
  }
  dfd.rejectWith( ajaxOpts.context || ajaxOpts,
    [ promise, statusText, "" ] );
  return promise;
};

function doRequest( next ) {
  jqXHR = $.ajax( ajaxOpts )
    .done( dfd.resolve )
    .fail( dfd.reject )
    .then( next, next );
}

return promise;

};

})(jQuery);

jQuery 1.4

Para jQuery 1.4, la cola de animación se puede utilizar para crear una "cola" personalizada. También puedes crear tu propio complemento $.ajaxQueue() que utiliza la cola 'fx' de jQuery para iniciar automáticamente la primera solicitud en la cola si aún no se está ejecutando.

Implementación:

var oldComplete = ajaxOpts.complete;

ajaxQueue.queue(function(next) {
  ajaxOpts.complete = function() {
    if (oldComplete) oldComplete.apply(this, arguments);
    next();
  };
  $.ajax(ajaxOpts);
});

};

})(jQuery);

Ejemplo:

url: '/echo/html/',
data: {html : "[" idx "] " $(this).html()},
type: 'POST',
success: function(data) {
  $("#output").append($("<li>", { html: data }));
}

});
});

Esto garantiza que cada solicitud de Ajax se ejecute secuencialmente, lo que permite un manejo elegante de la carga del servidor y mantiene la capacidad de respuesta del navegador. .

Declaración de liberación Este artículo se reimprime en: 1729396281 Si hay alguna infracción, comuníquese con [email protected] para eliminarla.
Último tutorial Más>

Descargo de responsabilidad: Todos los recursos proporcionados provienen en parte de Internet. Si existe alguna infracción de sus derechos de autor u otros derechos e intereses, explique los motivos detallados y proporcione pruebas de los derechos de autor o derechos e intereses y luego envíelos al correo electrónico: [email protected]. Lo manejaremos por usted lo antes posible.

Copyright© 2022 湘ICP备2022001581号-3