2013-05-13 10 views
5

Ich brauche das rohe XMLHttpRequest Objekt zuzugreifen, einen Datei-Upload-Fortschritt Rückruf bei Browser hinzufügen, die sie unterstützen. Ist das möglich, oder muss ich die rohe Anfrage selber konstruieren? Wenn ja, wie verpacke ich eine rohe XMLHttpRequest in einem Versprechen-Objekt?

Antwort

4

ich simuliert die $http Aufruf einer benutzerdefinierten XMLHttpRequest wie so konstruieren:

uploadFile(file, progressHandler) { 
    var xhr = new XMLHttpRequest(), 
     deferred = $q.defer(); 

    xhr.open("POST", "your/path", true); // method, url, async 
    xhr.setRequestHeader("Content-Type", file.type || "application/octet-stream"); 
    xhr.onreadystatechange = function (e) { 
    if (xhr.readyState == 4) { 
     $rootScope.$apply(function() { 
     // Construct a response object similar to a regular $http call 
     // 
     // data – {string|Object} – The response body transformed with the transform functions. 
     // status – {number} – HTTP status code of the response. 
     // headers – {function([headerName])} – Header getter function. 
     // config – {Object} – The configuration object that was used to generate the request. 
     var r = { 
      data: xhr.response, 
      status: xhr.status, 
      headers: xhr.getResponseHeader, 
      config: {} 
     }; 
     if (r.status == 200) { 
      deferred.resolve(r); 
     } else { 
      deferred.reject(r); 
     } 
     }); 
    } 
    }; 
    if (progressHandler && xhr.upload) { 
    xhr.upload.addEventListener('progress', function(e) { 
     progressHandler((e.loaded/e.total), e); 
    }, false); 
    } 
    // This is only available in XHR2, provide multipart fallback 
    // if necessary 
    xhr.send(file); 

    return deferred.promise; 
} 
+0

'getResponseHeader' nicht perfekt imitiert' headers' Funktion in normale Antwort zur Verfügung gestellt wird. Sie könnten auch 'xhr.response' in' JSON.parse (xhr.response) 'ändern und auch' statusText' zum Hash hinzufügen. –