Ajax requests in parallel

Asked

Viewed 531 times

1

I’m with a system that has some things that uses long Polling, it disturbs everything, any button you click (that makes an Ajax request) will take long because it has long Polling running.

Ajax by default creates a request queue, I want the requests to be executed at the same time, in parallel.

For example:

I’m fiddling with the site, meanwhile, I maintain an Ajax request that holds the server for 20sec.

If I click on anything or even go to another page, I have to wait for this 20sec request to end.

I want to be able to make several requests at the same time, like facebook. Does anyone know any techniques? Any references? I’ve heard of when, but that’s not what I need.

Ajax for the long

getNotifications();
    function getNotifications(lastRequest){
        if(!lastRequest){
            lastRequest = Math.round(+new Date()/1000);
        }
        $.ajax({
            url: "/ajax/get_notifications.php?last_request=" + lastRequest,
            type: "GET",
            async: true,
            success: function(data){
                data = $.parseJSON(data);
                if(data['exist_news'] == true){
                    document.getElementById('notifications').insertAdjacentHTML('afterbegin', data['news']);
                    var howMuchElement = document.getElementById('howMuchNotifications');
                    var howMuch = parseInt(howMuchElement.innerHTML);
                    var curHowMuch = data['howMuch'] + howMuch;
                    howMuchElement.innerHTML = curHowMuch;
                }
                getNotifications(data['last_request']);
            },
            error: function(error){
                showMsg(error['error']);
            }
        });
    }

Note: There is not even a problem with long Polling.

An example of a request I have

function loadModal(modalPage, modalBox, button){
    $.ajax({
        url: "/modals/" + modalPage,
        async: true,
        success: function(data){
            $("#" + modalBox + " .modal-body").html(data);  
            button.removeAttribute("onclick");  
        },
        beforeSend: function(){
            $("#" + modalBox + " .modal-body").html("<img src='/images/loading.gif'> Carregando...");
        },
        error: function(){
            $("#" + modalBox + " .modal-body").html("Ocorreu uma erro!");
        }
    });
}
  • It looks like you are using synchronous requests instead of asynchronous ones. Whether or not there is long Polling.

  • Use async: true

  • in fact I think even with the longpooling you can go printing the output as you load. Or you can make the ajax itself load item to items separately. instead of you performing the loops in your php file makes it display 1 return at a time and by the ajax you make the number d loops necessary. Just have a php file that returns the number of loops needed for the function. I made this way in 2 systems of mine that need several commands at the same time.

  • The function Ajax of jquery by default runs several requests in parallel without crashing the browser and without obeying call order, the request that ends first calls your callback and moves on...

  • Jasar, I didn’t quite get your idea...

  • Jader A. In mine he ends up creating a queue, which leaves several requests as pending, even to load the page.

  • could put your code in for us to take a look at?

  • I will put the long Polling code and one that I use to load small modals (which are the most general).

  • If no one knows, I’ll go to the websocket, someone could already put references here for study?

Show 4 more comments

1 answer

0

When making an ajax request, do it asynchronously. Follow code in Jquery, example of documentation:

$.ajax({
  url: "test.html",
  context: document.body
}).done(function() {
  console.log('oi');
});

async is enabled by default, if you want to disable async, which would make the browser wait for the server response to continue any task, just add async: false,.

More information the official documentation: http://api.jquery.com/jquery.ajax/

  • I use async: false

  • So this is the problem, with async:false you do in a non-synchronistic way, which ends up crashing the browser waiting for the ajax request. Only remove the async.

  • Sorry, I ended up copying from yours not to give more work and forgot to edit kkkkk, true use.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.