Gzip是啥

Gzip 是一种文件压缩格式和数据压缩算法，用于减少文件或数据的体积，从而提高存储和传输的效率。它最初是为了压缩 Unix 文件系统中的文件而设计的，但如今已经广泛应用于网络传输和数据存储领域。

Gzip 的特点

无损压缩：
数据在解压缩后完全还原，没有任何损失。
高效的压缩率：
对于文本文件（如 HTML、JSON、XML），压缩率通常在 50%-90% 之间。
广泛支持：
支持几乎所有现代浏览器、服务器和编程语言。

Gzip 与 Base64 为什么结合使用

Gzip 压缩的结果是二进制数据，不便于直接在文本传输中使用。
Base64 编码将二进制数据转换为文本形式，适合在 JSON、HTML、HTTP 请求中传递。
缺点：
Base64 会使数据膨胀 33%，但结合 Gzip 后，整体体积通常还是比原始数据小。

解压代码

import pako from 'pako';

Base64 只是对 Gzip 压缩后的数据进行编码，前端需要先将 Base64 解码为二进制数据，然后使用解压工具解压 Gzip 数据。

前端处理 Base64 Gzip 数据的步骤：

步骤 1: 解码 Base64
使用浏览器的 atob 函数将 Base64 转换为二进制字符串。

步骤 2: 转换为 Uint8Array
将二进制字符串转换为 Uint8Array，以便进行 Gzip 解压缩。

步骤 3: 解压 Gzip
使用解压工具（ pako）解压 Gzip 数据。

  /**
     * 解码并解压 Gzip 的 Base64 数据
     * @param {string} base64GzipData - 后端返回的 Base64 编码的 Gzip 数据
     * @returns {string} 解压后的字符串
     */
    decodeAndDecompress(base64GzipData) {
      try {
        // 解码 Base64 -> 二进制字符串
        const binaryString = atob(base64GzipData);
        // 转换为 Uint8Array
        const byteArray = new Uint8Array(binaryString.length);
        for (let i = 0; i < binaryString.length; i++) {
          byteArray[i] = binaryString.charCodeAt(i);
        }
        // 使用 pako 解压 Gzip
        const decompressedData = pako.inflate(byteArray, { to: 'string' });
        return decompressedData;
      } catch (error) {
        console.error('解压失败: ' + error.message);
        return '';
      }

使用

我项目中后端返回的是svg的base64字符串，前端使用v-html来渲染解压的字符串