JavaScript ajax，JSONP，回调函数可对数据进行处理

Question

Fellas,

I'm trying to do an ajax call to get some JSON. I can get around the cross origin issues in Chrome very easily but in IE the only way I got it working without throwing an error is using JSONP. My problem is that i don't know how to process the response. I can see that the call executes and it returns JSON in fiddler but how do i catch it and play with it in my code that's below.

$.support.cors = true;

            function callAjaxIE(){

            $.ajax({                    
                type: 'GET',            
                async: true,
                url: usageUrl,
                dataType: 'jsonp',
                crossDomain: true,
                jsonp: false,
                jsonpCallback: processDataIE,                       
            //  cache: false,
                success: function (data) {
                    alert('success');
                    //processData(data)
                },
                error: function (e){

                    console.log(e);
                }

             }).done(function (data) {                      
                    alert('done');              
             });

function processDataIE(){

alert('processing data ie');
}

It works when i run it, it displays a message box saying 'processing data ie' but so what. How do i play with the results?

UPDATE:

So I've updated the code as per Quentin. It doesn't go into the 'success' block. It errors out with the following.

When i look at fiddler. The JSON is there. How do i get it?

Answer 1

1. Don't force the function name. That's a recipe for race conditions. Remove jsonpCallback: processDataIE . Let jQuery determine the function name.
2. Don't remove the callback parameter from the URL. Make the server read callback from the query string to determine which function to call. Remove jsonp: false, .
3. Use the success function as normal. (Get rid of processDataIE , that's what success is for).

Asides:

crossDomain: true is pointless. It tells jQuery that when it is using XHR (which you aren't) and the URL is pointing to the same origin (which it isn't) then it should not add extra headers in case the server does an HTTP redirect to a different origin.

async: true is pointless. That's the default, and JSONP requests can't be anything other than async anyway.

$.support.cors = true; is pointless at best and can be harmful. Remove it.

Don't override jQuery's detection of support for CORS by the browser. You can't make ancient browsers support CORS by lying to jQuery. You're using JSONP anyway, so CORS is irrelevant.

---

The above is the sensible, standard, robust solution.

If you want the quick hack that maintains all the bad practises you have in play, then just look at the first argument to processDataIE .