0

I'm currently looking at 

function readDataFromURL(fuFullHttpURL, fuCallMeOnLoad) {
    var MyThis = this;
    this.fullHttpURL = fuFullHttpURL;
    this.callMeOnLoad = fuCallMeOnLoad;
    var oReq = new XMLHttpRequest();
    oReq.open("GET", MyThis.fullHttpURL, true);
    oReq.responseType = "arraybuffer";
    oReq.onload = function(oEvent) {
        var blob = new Blob([oReq.response], {type: "image/jpg"});
        MyThis.callMeOnLoad(blob);
    };
    oReq.send();
}

But that is only for download. How do I upload with this code? And when I tried downloading an image with xmlhttprequest in former years there was a size restriction to the download. Is there still a size restriction? In former times every browser handeled this size-restriction differently, so I can't test this myself.

Edit: https://stackoverflow.com/a/18120473/3716796 seems to explain uploading.

Community
  • 1
  • 1
John2015
  • 77
  • 9

1 Answers1

0

You can use FormData to send files in XMLHttpRequest like below . Although Chrome & FF support it well, it works only in IE10 or above.

  var xhr = new XMLHttpRequest();
  var file = document.getElementById("fileUpload");
  var formData = new FormData();
  formData.append("upload", file.files[0]);
  xhr.open("post", "your-url", true);
  xhr.setRequestHeader("Content-Type", "multipart/form-data");
  xhr.upload.onload = function(event){
    // handle successful upload
  };
  xhr.send(formData);
Arkantos
  • 6,530
  • 2
  • 16
  • 36
  • Ty! So I'm pretty sure I can handle upload an download now in principle. (I have also found http://stackoverflow.com/a/18120473/3716796) - So there is only the question of a size-restriction for downloading which I have read about. (I can only test in Firefox, and I'm not sure if my test is reliable because of some current specific settings here.) – John2015 Feb 25 '15 at 09:34
  • I have some dynamically created image-tag in the webpage. How could I access the image-data and upload it? – John2015 Feb 25 '15 at 09:41
  • For more info on downloads limit, see [this](http://blogs.msdn.com/b/ieinternals/archive/2011/03/10/wininet-internet-explorer-file-download-and-upload-maximum-size-limits.aspx) – Arkantos Feb 25 '15 at 09:43
  • are you using `canvas` or just `img` ? – Arkantos Feb 25 '15 at 09:53
  • I'm having a canvas actually. – John2015 Feb 25 '15 at 10:31
  • If you're drawing the image to canvas, then you can use canvas context's `getImageData()` to get `ImageData` object whose `data` property will be the byte array – Arkantos Feb 25 '15 at 10:44
  • I just would like to present the upload to the server as file, so I don't have to decode the imageData on the server. Stackoverflow suggests to move the discussion to chat, but I can'T with 15 reputation. But I'm pretty confident I can post a solution in some hours to conclude it. – John2015 Feb 25 '15 at 11:06