Search code examples
javascriptarraysbinarytyped-arrays

Binary Data from server is missing bytes when using Javascript XMLHttpRequest


I have been working on this for days now with no avail :( Any help would be greatly appreciated.

I am trying to download a file as a typed array using this method below:

var oReq = new XMLHttpRequest();
oReq.open("GET", "/myfile.png", true); //This is the path to my file 
oReq.responseType = "arraybuffer";

oReq.onload = function (oEvent) {
 var arrayBuffer = oReq.response; 
 var array = new Uint8Array(arrayBuffer ); //This is the array I retrieve from my file
};

oReq.send(null);

When I do this with all assets being on my computer's hard drive it works perfectly and I'll get a response back that looks like this (this is just example data):

array[0] = 10;
array[1] = 15;
array[2] = 20;
array[3] = 17;
array[4] = 18;
array[5] = 23;
array[6] = 25;
array[7] = 12;
array[8] = 2;
array[9] = 10;
...

However when I upload everything to the server I get a result that looks like this:

array[0] = 10;
array[1] = 15;
array[2] = 20;
array[3] = 17;
array[4] = 18;
array[5] = 25;  //This number is missing from above, it should be 23
array[6] = 12;
array[7] = 2;
array[8] = 10;
array[9] = 18;
...

I have tried everything I can think of to fix this problem. Clearing the cache, turning gzip on and off, testing it with different devices (ie loading it on a phone and a computer), but nothing has been of any help so far.

What strikes me as odd is that the same numbers are consistently wrong every time. So I don't think they are getting "lost" over the network. Also when I test it with a different server I get different numbers that drop. So it seems like every server drops a different set of numbers.

Does anyone know why this is and could you lead me toward a direction to help fix the problem? Thank you so much!


Solution

  • I figured it out... wow was this an interesting experience.

    It turns out the FTP client I was using (FileZilla) has a setting that automatically tries to detect a files datatype and make necessary adjustments to it in order to display properly across all OS systems.

    It is a documented behavior that can be read about here: https://wiki.filezilla-project.org/Data_Type

    When I turned this behavior off (switched it from auto to binary under that "transfer" - "transfer-type" tabs) everything is working again as expected.

    I want to thank Jaromanda X so much for his willingness to help. His answers gave me the insight I needed to play around with these settings. I hope this will help others in the future who have the same problem!