JavaScript/C# Inflate and deflate data sent through XHR

Question

I must inflate some data (csv file chunks actually) client side in JavaScript, and deflate it on server side in C#.

On client side I'm using pako, and it looks like this:

var fileReader = new FileReader();

fileReader.onload = function(progressEvent) {
    var arrayBuffer = this.result;
    var binData = new Uint8Array(arrayBuffer);

    var data = pako.deflate(binData);

    var dataBlob = new Blob(data, { "type": "application/zlib" });
    callback(dataBlob);
};

fileReader.readAsArrayBuffer(bytes);

It seems to be working well. I say "seem" because if I save the data received on server side, I get a string looking like this:

1201562201899117927731141602491...

I found out that ZLib compressed data is supposed to start with 0x78 and 0x9C, and 120 is decimal for 0x78 and 156 is decimal for 0x9C, so client side inflate seems OK.

Problem is on server side I can't manage to deflate the data. This is what my code looks like:

// Read past the first two bytes of the zlib header
inputStream.Seek(2, SeekOrigin.Begin);

using (var zipStream = new DeflateStream(inputStream, CompressionMode.Decompress))
using (FileStream fileStream = File.Create(filePath))
{
    zipStream.CopyTo(fileStream);
}

I get an error from DeflateStream constructor saying the data is not quite right.

Now here is what I gathered so far:

• If I add a { "to": "string" } to pako.deflate, it returns some binary string instead of a Uint8Array. It looks quite like what I get when I inflate the data server side, so that's probably what C# DeflateStream is expecting.
• Data is sent through XHR FormData, which expects a Blob, which seems to always transform the data to a decimal string.
• I read the data on server side with HttpContent.ReadAsStreamAsync().

What do you think I should do to properly deflate the data server side?

Answer 1

Pass the data to the blob constructor in an array

var dataBlob = new Blob([data], { "type": "application/zlib" });

From MDN

Syntax

var aBlob = new Blob( array, options );

Parameters

• array is an Array of ArrayBuffer, ArrayBufferView, Blob, DOMString objects, or a mix of any of such objects, that will be put inside the Blob.