Results 1 to 3 of 3

Thread: What's the best way to "Queue" one by one AJAX requests?

  1. #1
    Sencha Premium User SebTardif's Avatar
    Join Date
    Feb 2011
    Location
    Cambridge, MA
    Posts
    1,294
    Answers
    16

    Default What's the best way to "Queue" one by one AJAX requests?

    These use cases could have variations, like 2 AJAX request maximum concurrently, or cancel all requests while one is running. In my case, I want that each call wait, accumulate in a queue, so when the one running is done, the next one run.

  2. #2
    Sencha Premium Member
    Join Date
    Dec 2012
    Location
    Seattle, WA
    Posts
    423
    Answers
    34

    Default

    Why not create a singleton class and update an object or array before and after every ajax request as well as a getter to detect the number of requests in the object or array.

  3. #3
    Sencha Premium User SebTardif's Avatar
    Join Date
    Feb 2011
    Location
    Cambridge, MA
    Posts
    1,294
    Answers
    16

    Default

    Each request needs a way to notify its completion, so I ended up to use promise mechanism. It looks like this:

    Caller do something like:
    Code:
    saveStore: function(store){
                    // asynchronous, will move on pretty fast
            acme.Queue.byMethodName(this.getRunnableSaveStorePromise(store));
        }
    The getRunnableSaveStorePromise is a reworked version of a normal save code + use promise to notify completion, the all thing returned as a function:
    Code:
    getRunnableSaveStorePromise: function(store){
            var me = this;
            
            return function(){
    
    
            var promises = [];
        
                var jsonObj = {
                        changeLogData : value
                };
                
                
                var deferred = new Ext.Deferred();
                acme.app.post.request({
                    url : url,
                    jsonData : jsonObj,
                    success : function(response, opts) {
                        var obj = Ext.decode(response.responseText);            
                        store.commitChanges();
                    },
                    callback: function(options, success, response){
                        deferred.resolve(response);
                    },
                    scope : this
                });
                promises.push(deferred.promise);
            }, this);
            var batchpromise = Ext.Deferred.all(promises);
            return batchpromise;
            
        }
    Then the framework code that automatically queue all the call to Queue.byMethodName:
    Code:
    Ext.define('acme.Queue', {
        statics : {
            queueMap:{ },
            byMethodName : function(runnablePromise) {            
                // get method name using introspection
                var methodName = this.byMethodName.caller.name;
                
                // check if already have it in the map
                var promises = gdmaapp.Queue.queueMap[methodName];
                
                if (Ext.isEmpty(promises)){
                    promises = [];
                    // if don't have it add it
                    gdmaapp.Queue.queueMap[methodName] = promises;
                }
                
                // add to the end our new runnablePromise
                promises.push(runnablePromise);
                
                // if the list have only one item, run it with callback that will continue the loop
                if (promises.length == 1){
                    // bootstrap the queue loop
                    gdmaapp.Queue.byMethodNameCallback(methodName,promises);
                } else {
                    // if the list have more than one item, nothing else to do
                }
            },
            byMethodNameCallback: function(methodName,promises,values) {
                if (values != undefined){
                    // called following an execution instead of initial startup of the queue
                    promises.shift(); // remove the first item in the array
                }
                
                if (promises.length != 0 ){
                    var promiseToExecute = promises[0];
                    
                    // execute the promise
                    var promise = promiseToExecute();
                
                    Ext.promise.Promise.all(promise).then(function(values) {gdmaapp.Queue.byMethodNameCallback(methodName,promises,values);});
                }
            }
        }
    });
    Sencha Enhancement Request: EXTJS-22848

Similar Threads

  1. Replies: 4
    Last Post: 23 Nov 2011, 6:15 AM
  2. Passing numeric "0" to Ajax Requests
    By alexdemers in forum Ext 3.x: Help & Discussion
    Replies: 25
    Last Post: 10 Jun 2009, 7:39 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •