Cancelar peticiones ASP.NET AJAX

ASP_NET-AJAX Para plantear la cancelación de una llamada asíncrona realizada con ASP.NET AJAX primero tenemos que tener en cuenta como hemos realizado esta petición, para realizar esta acción podemos elegir entre dos opciones diferenciadas.

  1. El control UpdatePanel que encapsula las peticiones web de forma asíncrona.
  2. Las llamadas a Métodos de Páginas o Servicios web desde el cliente.

1. UpdatePanel

Si hemos elegido la primera opción, cualquier control que realice una petición al servidor será controlada por el ScriptManager y podremos utilizar este mismo control para cancelar la tarea del cliente.

Para poder habilitar la cancelación al cliente usaré una barra de progreso la cual informará al usuario que se esta realizando una tarea y además tendrá un botón para poder cancelar este proceso.

ProgressCCentrar UpdateProgress en un UpdatePanel ( JQuery )

Lo único que necesitamos es que el botón de la barra de progreso llame a una función javascript, que será la encargada de anular la petición.

function Cancelarproceso() {

  var proceso = Sys.WebForms.PageRequestManager.getInstance();
  if (proceso.get_isInAsyncPostBack()) {
      proceso.abortPostBack();
  }
  if ($('input[type=submit]').length)
      $('input[type=submit]').attr('disabled', false);

  $("#progress").hide();
  //Para no enviar el evento al servidor.
  return false;
}

Este código recupera la instancia del PageRequestManager y si es un postBack asíncrono llama a la función abortPostBack().

2. Métodos de Página

Teniendo en cuenta las penalizaciones al utilizar los UpdatePanels en el rendimiento y que solo podemos tener una llamada asíncrona a la vez, podemos optar por utilizar los métodos de página para realizar múltiples llamadas asíncronas y de una manera mas ligera.

En este ejemplo utilizo una lista para lanzar multiples llamadas al servidor y mostrar una animación para avisar al usuario que el proceso esta en marcha, de la misma manera damos la opción de anular cada llamada con un botón enlazado a cada proceso.

ProgressMultiC

 

¿Como funciona este el control?

  1. El botón actualizar recorre la lista y lanza todos los procesos que estén con el check seleccionado.
  2. Creo un Array en Javascript para guardar la instancia del método de página utilizado y poderlo identificar cada una de las llamadas.
    var p = new Array();
    
    
    
    function lanzarprocesoAsinc(div, n) {
    
        var par = div + "|" + $("#" + div).attr("cr") + 
    
            "|" + $("#" + div).attr("tran");
    
        p[n] = PageMethods._staticInstance.LanzarprocesoCRI(par, 
    
            lanzarprocesoCRI_OK, lanzarprocesoCRI_KO, div);
    
    }
    
    
    
    
    
  3. Cuando se presiona el botón de anulación se invoca una función javaScript que localiza la instancia de la petición asíncrona y anula el proceso.  Recuperamos el elemento de ejecución de la instancia y si no está marcada como abortada, la marca. Finalmente oculta la barra de progreso del elemento de la lista.
function AnularProcesoAsinc(n, div) {
    var executor = p[n].get_executor();
    if (executor.get_started()) {
        if (!executor._aborted) {
            executor.abort();
            $("#" + div).show("slow");
            $("#"+ div+ "_W").hide("slow");
        }
    }
}

Muy Importante !!!

Cuando habilitas la anulación de un proceso asíncrono tienes que tener muy claro que solo se anula la devolución del cliente. Que solo se cierra el socket de cliente del cual se reciben las respuestas. No hay repercusión en el código que se ejecuta en el servidor.

Para hacer que todo el proceso finalice, tienes que tener todo tu modelo previamente estructurado y pensar cual de estos procesos se pueden anular y cuales no. Si quieres profundizar en este sentido tienes el artículo de Dino Esposito donde explica estas situaciones mas detalladamente Cutting Edge:Cancelación de las tareas de servidor con AJAX de ASP.NET.

 

 

3 comentarios en “Cancelar peticiones ASP.NET AJAX”

  1. Marc, tengo un problema, resulta que al presionar un boton como el guardar y la pagina esta lenta , da la impesion de que no guarda y se preina varias veces, entonces se guardan y crean varios registros distitntos en la BD, como hago para controar que solo se presione una vez y que no guarde mientras se hace el postback

  2. Estimado, me vi en la obligación moral de informarle que utilicé su código para validar que no se presionara enviar mientras hubiese un postback en ejecucion.

    Se agradece mucho.

    Saludos.

  3. Lo normal es que cuando lances el evento del botón lo bloquees para que no se vuelva a presionar hasta que el proceso no finalice, yo tuve problemas con FireFox porque deshabilitar el botón no funcionaba y al final opte por ocultar el botón 🙁

    espero que te sirva.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *