PHP(gzdeflate/gzinflate)+JS(pako)前后端數(shù)據(jù)壓縮
2022-04-29 14:01:31

/**
* util.js
*/

// uint8array轉(zhuǎn)為base64字符串
function uint8arrayToBase64(u8Arr) {
  let CHUNK_SIZE = 0x8000; //arbitrary number
  let index = 0;
  let length = u8Arr.length;
  let result = '';
  let slice;
  while (index < length) {
    slice = u8Arr.subarray(index, Math.min(index + CHUNK_SIZE, length));
    result += String.fromCharCode.apply(null, slice);
    index += CHUNK_SIZE;
  }
  // web image base64圖片格式: "data:image/png;base64," + b64encoded;
  // return  "data:image/png;base64," + btoa(result);
  return window.btoa(result);
}
// base64字符串轉(zhuǎn)為uint8array數(shù)組
function base64ToUint8Array(base64String) {
  let padding = '='.repeat((4 - base64String.length % 4) % 4);
  let base64 = (base64String + padding)
    .replace(/-/g, '+')
    .replace(/_/g, '/');
  let rawData = window.atob(base64);
  let outputArray = new Uint8Array(rawData.length);
  for (var i = 0; i < rawData.length; ++i) {
    outputArray[i] = rawData.charCodeAt(i);
  }
  return outputArray;
}

<!-- 引入 pako-->
<script src="https://cdn.jsdelivr.net/npm/pako@2.0.4/dist/pako.min.js"></script>
<!-- 引入 工具類 -->
<script src="./util.js"></script>

<script>
  // JS壓縮，注意：需要引入dist/pako_deflate.js(僅支持壓縮)或dist/pako.js(支持壓縮和解壓)
  function compress(data) {
    return uint8arrayToBase64(pako.deflateRaw(data, {
      to: 'string'
    }))
  }
  
  var data = {
    title: "滿江紅·為問封姨",
    author: "納蘭性德〔清代〕",
    date: "2022-04-02",
    content: "為問封姨，何事卻、排空卷地。又不是、江南春好，妒花天氣。葉盡歸鴉棲未得，帶垂驚燕飄還起。甚天公、不肯惜愁人，添憔悴。攪一霎，燈前睡。聽半晌，心如醉。倩碧紗遮斷，畫屏深翠。只影凄清殘燭下，離魂飄緲秋空里?？傠S他、泊粉與飄香，真無謂。"
  }
  var compressedBase64 = compress(JSON.stringify(data));
  console.log(compressedBase64);
  // TZDLTsJQFEX/pWNNCHHk3xA10cRoYurImLRFQAoFguWhVnkoRQyP1leblkLir3DPub0jf8FzHTndZ+19dvaFoh6pxwfKroLxAP0ej4bfAQsj0ZmDp8P4RdlScufq4ekZITx6h4KH2hhWwUazMSyw+GmjtYjZz6kyJJvJZrczO9uZLGl7pyfqwYlK8v/An2WVJS0WVcD62Gg61pp8EoEVgONtNAPq1yy0sLuQJ78HVge7Ixgl5AK3mZo+PE/Qs//IL/ASSJoidLHfRucVVh2JhS48Gpg3eaklnrrpupt+UluD23fkhcKUkulFaiww7+CVzqKIXBjEWLTRoEoGNgos1IRTI53rCyhb/GEgPzamYJl4W5Vf1nlwDVEsS12b8OGYR77Q59ieSZcdg1/HwOfr/l/VV0h8KF3RYjiv8Pw9CysSc2MxM6gkX17zcYV2EKWqLKDF4q7O4rYc4d3kb2UW1ggT7q10OT3s9FPvhkjl8hc=
</script>

<!-- 引入 pako-->
<script src="https://cdn.jsdelivr.net/npm/pako@2.0.4/dist/pako.min.js"></script>
<!-- 引入 工具類 -->
<script src="./util.js"></script>

<script>
    // JS解壓，注意：需要引入dist/pako_inflate.js(僅支持壓縮)或dist/pako.js(支持壓縮和解壓)
    function decompress(str) {
      return pako.inflateRaw(base64ToUint8Array(str), {
        to: 'string'
      });
    }
    
    let str  = 'TZDLTsJQFEX/pWNNCHHk3xA10cRoYurImLRFQAoFguWhVnkoRQyP1leblkLir3DPub0jf8FzHTndZ+19dvaFoh6pxwfKroLxAP0ej4bfAQsj0ZmDp8P4RdlScufq4ekZITx6h4KH2hhWwUazMSyw+GmjtYjZz6kyJJvJZrczO9uZLGl7pyfqwYlK8v/An2WVJS0WVcD62Gg61pp8EoEVgONtNAPq1yy0sLuQJ78HVge7Ixgl5AK3mZo+PE/Qs//IL/ASSJoidLHfRucVVh2JhS48Gpg3eaklnrrpupt+UluD23fkhcKUkulFaiww7+CVzqKIXBjEWLTRoEoGNgos1IRTI53rCyhb/GEgPzamYJl4W5Vf1nlwDVEsS12b8OGYR77Q59ieSZcdg1/HwOfr/l/VV0h8KF3RYjiv8Pw9CysSc2MxM6gkX17zcYV2EKWqLKDF4q7O4rYc4d3kb2UW1ggT7q10OT3s9FPvhkjl8hc=';
    var rawData = decompress(str);
    console.log(rawData);
    // {"title":"滿江紅·為問封姨","author":"納蘭性德〔清代〕","date":"2022-04-02","content":"為問封姨，何事卻、排空卷地。又不是、江南春好，妒花天氣。葉盡歸鴉棲未得，帶垂驚燕飄還起。甚天公、不肯惜愁人，添憔悴。攪一霎，燈前睡。聽半晌，心如醉。倩碧紗遮斷，畫屏深翠。只影凄清殘燭下，離魂飄緲秋空里?？傠S他、泊粉與飄香，真無謂。"}
</script>

<?php

// php壓縮
function compress($str)
{
    return base64_encode(gzdeflate($str, 9));
}

$array = [
    'title'   => "滿江紅·為問封姨",
    'author'  => "納蘭性德〔清代〕",
    'date'    => "2022-04-02",
    'content' => "為問封姨，何事卻、排空卷地。又不是、江南春好，妒花天氣。葉盡歸鴉棲未得，帶垂驚燕飄還起。甚天公、不肯惜愁人，添憔悴。攪一霎，燈前睡。聽半晌，心如醉。倩碧紗遮斷，畫屏深翠。只影凄清殘燭下，離魂飄緲秋空里?？傠S他、泊粉與飄香，真無謂。"
];

echo compress(json_encode($array, JSON_UNESCAPED_UNICODE));
// TZDLTsJQFEX/pWNNCHHk3xA10cRoYurImLRFQAoFguWhVnkoRQyP1leblkLir3DPub0jf8FzHTndZ+19dvaFoh6pxwfKroLxAP0ej4bfAQsj0ZmDp8P4RdlScufq4ekZITx6h4KH2hhWwUazMSyw+GmjtYjZz6kyJJvJZrczO9uZLGl7pyfqwYlK8v/An2WVJS0WVcD62Gg61pp8EoEVgONtNAPq1yy0sLuQJ78HVge7Ixgl5AK3mZo+PE/Qs//IL/ASSJoidLHfRucVVh2JhS48Gpg3eaklnrrpupt+UluD23fkhcKUkulFaiww7+CVzqKIXBjEWLTRoEoGNgos1IRTI53rCyhb/GEgPzamYJl4W5Vf1nlwDVEsS12b8OGYR77Q59ieSZcdg1/HwOfr/l/VV0h8KF3RYjiv8Pw9CysSc2MxM6gkX17zcYV2EKWqLKDF4q7O4rYc4d3kb2UW1ggT7q10OT3s9FPvhkjl8hc=

<?php

// PHP解壓
function decompress($str)
{
    return gzinflate(base64_decode($str));
}


$base64String = 'TZDLTsJQFEX/pWNNCHHk3xA10cRoYurImLRFQAoFguWhVnkoRQyP1leblkLir3DPub0jf8FzHTndZ+19dvaFoh6pxwfKroLxAP0ej4bfAQsj0ZmDp8P4RdlScufq4ekZITx6h4KH2hhWwUazMSyw+GmjtYjZz6kyJJvJZrczO9uZLGl7pyfqwYlK8v/An2WVJS0WVcD62Gg61pp8EoEVgONtNAPq1yy0sLuQJ78HVge7Ixgl5AK3mZo+PE/Qs//IL/ASSJoidLHfRucVVh2JhS48Gpg3eaklnrrpupt+UluD23fkhcKUkulFaiww7+CVzqKIXBjEWLTRoEoGNgos1IRTI53rCyhb/GEgPzamYJl4W5Vf1nlwDVEsS12b8OGYR77Q59ieSZcdg1/HwOfr/l/VV0h8KF3RYjiv8Pw9CysSc2MxM6gkX17zcYV2EKWqLKDF4q7O4rYc4d3kb2UW1ggT7q10OT3s9FPvhkjl8hc=';

print_r(decompress($base64String));
// {"title":"滿江紅·為問封姨","author":"納蘭性德〔清代〕","date":"2022-04-02","content":"為問封姨，何事卻、排空卷地。又不是、江南春好，妒花天氣。葉盡歸鴉棲未得，帶垂驚燕飄還起。甚天公、不肯惜愁人，添憔悴。攪一霎，燈前睡。聽半晌，心如醉。倩碧紗遮斷，畫屏深翠。只影凄清殘燭下，離魂飄緲秋空里。總隨他、泊粉與飄香，真無謂。"}