XMLHttpRequest对象回调不会在跨域jquery / Ajax请求中触发

Question

So I've got this code:

$.ajax({
    xhr: function() {
        var xhr = new window.XMLHttpRequest();

       xhr.addEventListener("progress", function(evt) {
           if (evt.lengthComputable) {
               var percentComplete = evt.loaded / evt.total;
               console.log(percentComplete);
           }
       }, false);

       return xhr;
    },
  dataType: "jsonp",
  contentType: "text/javascript charset-utf-8",
  url: "http://*******.com/pcm/datamobile.asmx/ObtenerContactos",
  crossDomain: true, 
  timeout:8000000,
  data: {sessionId: 1},
  error : function (xhr, status) {

      },
 success : function() {FirstAjaxReady();} 
});   
}

The function in the xhr: option never fires. I'm trying to get a progress report on the request. This may have something to do with the fact that it is cross-domain. If so, is there a way to have a progress report in a cross-domain Ajax request?

Answer 1

Crossdomain, or Cross-Origin, needs to be enabled on the server-side as well

http://en.wikipedia.org/wiki/Cross-Origin_Resource_Sharing

And the CORS security does seem to dictate that progress will not be sent:

CORS API specifications also need to ensure not to reveal anything until the cross-origin request status is set to preflight complete or success to prevent eg port scanning.

In XMLHttpRequest progress events are dispatched only after the cross-origin request status is set to success. Upload progress events are only dispatched once the cross-origin request status is preflight complete.

If I am reading that correctly.

http://www.w3.org/TR/cors/#preflight-request