How to get rid of synchronous call in jsonp crossdomain call

Question

I have got below Jquery JSONP two calls, it is for crossdomain calls, now when page is loading it fires these two calls and the problem is now the calls are very fast and before the fast is completed and it fires the second call and this is giving parser error for second call (airxml: is not a function).

Now below code works fine if we have got async: false, in the call, but as per the crossdomain policy it does not support the synchronous calls.

var oXMLHTTP, i, length, oData, sValue, sDisplay, sName, sMatch, oRegExp;
     var qr = "&jsonpcall=true";
   if (!oDropdown)
        return;

    oXMLHTTP = this.createXMLHttpRequest();
    this.FilterUrl = sFilterUrl;
    if (sFilterUrl != previousFilterUrl)
    {

        var regUrl = sFilterUrl;               
        var regquest = $.ajax({
            url: regUrl+qr,  
            type: "GET",
            async: false,   
            cache: true,                            
            contentType: "application/json; charset=utf-8",
            dataType: "jsonp",
            jsonpCallback: "airport",                 
            success: function(data, textStatus, jqXHR) 
            {                
                if (data.result[0] != '')
                {
                        sFilterData = data.result[0];                   
                }          
            }
            }); 
        previousFilterUrl = sFilterUrl;
    }

    if(!fireRequestOnce ||(fireRequestOnce && retrievedData == null))
    {       
         var regUrl = sXML;  
         var airquest = $.ajax({
            url: regUrl+qr, 
            async: false,                 
            dataType: 'jsonp',
            jsonpCallback: 'airxml',            
            cache: true,
            success: function(data, textStatus, jqXHR) 
            {
                    var xmlDoc = $.parseXML(data.myresult);
                oData = xmlDoc.documentElement.childNodes;
            }
        });
    }

Please suggest what can be the best approach, I have tried putting variable after the success event fires and then was trying to call second call, but it didn't worked.

score 0 · Accepted Answer · edited May 23 '17 at 11:49

0

When you need sequential AJAX call, try to avoid the async:false or jQuery.ajaxSetup({async:false}); What these option does is , it will lock the browser until the AJAX call completes. In this type of situation I prefer ajaxQueue plugin by gnarf.

What this plugin will do is, it will en-queue all incoming AJAX requests, and process one after another. It is pretty simple to use as shown here.

edited May 23 '17 at 11:49

Community

1
1

answered May 24 '12 at 06:26

tusar

3,364
6
37
60

So this implementation will work with crossdomain calls using jsonp – Manoj Singh May 24 '12 at 06:38
umm... it wont be wise enough to say without trying hands on, my guess is, the plugin will work for cross-domain requests too. You could try or ask the creator directly. Personally I didn't use it for cross-domain. And I never will. I will setup a server-sided code, that will fetch the data from another domain, and send it to front-end via same origin ajax-call. – tusar May 24 '12 at 06:55
you can also have a look into jquery.when/then/pipe ! – Karussell Nov 06 '12 at 19:56
You can also use recursion. – Alex Shilman Aug 19 '14 at 20:19

How to get rid of synchronous call in jsonp crossdomain call

1 Answers1