关于gzip本地读取和联网读取的区别

Question

本想做次项目优化的，就用到gzip 。但是后端不配合，说项目服务器关联东西较多，不敢轻易配置gzip压缩。
作为一个唯唯诺诺的前端就只好另辟蹊径。
项目打包使用了webpack，所以页面关联的东西就两个:一个较大的脚本和一个样式文件。
我的思路就是，自己手动改成请求gz文件；

例如 ： <script src=./static/js/index.js/>
我就改成用get 请求 ./static/js/index.js.gz文件
然后用pako 解码 
用eval在运行起来

结果 get 请求到的内容转成16进制之后，和直接本地read的不一样。

function strToHexCharCode(str) {
  var hexCharCode = [];
  var chars = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F"];
  for (var i = 0; i < str.length; i++) {
    var bit = (str[i] & 0x0f0) >> 4;
    hexCharCode.push(chars[bit]);
    var bit = str[i] & 0x0f;
    hexCharCode.push(chars[bit]);
  }
  return hexCharCode.join("");
}

function strToUtf8Bytes(str) {
  const utf8 = [];
  for (let ii = 0; ii < str.length; ii++) {
    let charCode = str.charCodeAt(ii);
    if (charCode < 0x80) utf8.push(charCode);
    else if (charCode < 0x800) {
      utf8.push(0xc0 | (charCode >> 6), 0x80 | (charCode & 0x3f));
    } else if (charCode < 0xd800 || charCode >= 0xe000) {
      utf8.push(0xe0 | (charCode >> 12), 0x80 | ((charCode >> 6) & 0x3f), 0x80 | (charCode & 0x3f));
    } else {
      ii++;
      charCode = 0x10000 + (((charCode & 0x3ff) << 10) | (str.charCodeAt(ii) & 0x3ff));
      utf8.push(
        0xf0 | (charCode >> 18),
        0x80 | ((charCode >> 12) & 0x3f),
        0x80 | ((charCode >> 6) & 0x3f),
        0x80 | (charCode & 0x3f),
      );
    }
  }
  //兼容汉字，ASCII码表最大的值为127，大于127的值为特殊字符
  for (let jj = 0; jj < utf8.length; jj++) {
    var code = utf8[jj];
    if (code > 127) {
      utf8[jj] = code - 256;
    }
  }
  return utf8;
}

get解析

本地read

我就蒙了。直接用base64解码出来的也不一样。
get base64

本地在线 gzip

有没有哪位大腿指点一下这到底是是怎么回事。

Answer 1

用jszip打包文件和解压，不需要自己写，自己写可能环境不统一文件生成有出入什么的，统一jszip就没问题了
参考下面的

JSZip Create .zip files using JavaScript. Provides a simple API to place any content generated by JavaScript into a .zip file for your users. https://stuk.github.io/jszip/

之前回答的一个问题，题主参考下

js文件超过1mb如何压缩-有问必答-CSDN问答 CSDN问答为您找到js文件超过1mb如何压缩相关问题答案，如果想了解更多关于js文件超过1mb如何压缩 有问必答、javascript、es6 技术问题等相关问答，请访问CSDN问答。 https://ask.csdn.net/questions/7488718