带有偏移量的 JavaScript 中的 GZip 解压缩

Question

An API that I am trying to use is returning base64 encoded responses. The response is first compressed using GZip with 4 bits of offset and then base64 encoded. I tried parsing the response using JavaScript ( pako and zlib ) and in both cases, it failed. The API has an example of C# code on how should the response decompression work, but I don't really know how can I transform that into JavaScript. So can anyone give me a hand transforming this function into JavaScript or just give me some tips on how to handle the 4 bytes offset? I didn't find anything relevant in the libraries' documentation.

public string Decompress(string value)
{
  byte[] gzBuffer = Convert.FromBase64String(value);
  using (MemoryStream ms = new MemoryStream())
  {
    int msgLength = BitConverter.ToInt32(gzBuffer, 0);
    ms.Write(gzBuffer, 4, gzBuffer.Length - 4);
    byte[] buffer = new byte[msgLength];
    ms.Position = 0;
    using (System.IO.Compression.GZipStream zip = new System.IO.Compression.GZipStream(ms, System.IO.Compression.CompressionMode.Decompress))
    {
      zip.Read(buffer, 0, buffer.Length);
    }
    return System.Text.Encoding.Unicode.GetString(buffer, 0, buffer.Length);
   }
}

Answer 1

I'm going to use fflate (disclaimer, I'm the author) to do this. If you want to translate that function line for line:

// This is ES6 code; if you want better browser compatibility
// use the ES5 variant.
import { gunzipSync, strToU8, strFromU8 } from 'fflate';
const decompress = str => {
  // atob converts Base64 to Latin-1
  // strToU8(str, true) converts Latin-1 to binary
  const bytes = strToU8(atob(str), true);
  // subarray creates a new view on the same memory buffer
  // gunzipSync synchronously decompresses
  // strFromU8 converts decompressed binary to UTF-8
  return strFromU8(gunzipSync(bytes.subarray(4)));
}

If you don't know what ES6 is:

In your HTML file:

<script src="https://cdn.jsdelivr.net/npm/fflate/umd/index.js"></script>

In your JS:

var decompress = function(str) {
  var bytes = fflate.strToU8(atob(str), true);
  return fflate.strFromU8(fflate.gunzipSync(bytes.subarray(4)));
}

I'd like to mention that streams are almost totally useless if you're going to accumulate into a string at the end, so the C# code is suboptimal. At the same time, since you're using the standard library, it is the only option.

In addition, I'd highly recommend using the callback variant (ie gunzip instead of gunzipSync ) if possible because that runs on a separate thread to avoid causing the browser to freeze.