JS前端压缩和解压
第三方工具库 pako
doc: http://nodeca.github.io/pako/
github: https://github.com/nodeca/pako
cdn: https://www.jsdelivr.com/package/npm/pako?path=dist
npmjs： https://www.npmjs.com/package/pako
前端工具类
/** * util.js */ // uint8array转为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字符串转为uint8array数组 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; }
1、压缩
<!-- 引入 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: "为问封姨，何事却、排空卷地。又不是、江南春好，妒花天气。叶尽归鸦栖未得，带垂惊燕飘还起。甚天公、不肯惜愁人，添憔悴。搅一霎，灯前睡。听半晌，心如醉。倩碧纱遮断，画屏深翠。只影凄清残烛下，离魂飘缈秋空里。总随他、泊粉与飘香，真无谓。" } 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>
2、解压
<!-- 引入 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":"为问封姨，何事却、排空卷地。又不是、江南春好，妒花天气。叶尽归鸦栖未得，带垂惊燕飘还起。甚天公、不肯惜愁人，添憔悴。搅一霎，灯前睡。听半晌，心如醉。倩碧纱遮断，画屏深翠。只影凄清残烛下，离魂飘缈秋空里。总随他、泊粉与飘香，真无谓。"} </script>
PHP端压缩和解压
1、压缩
<?php // php压缩 function compress($str) { return base64_encode(gzdeflate($str, 9)); } $array = [ 'title' => "满江红·为问封姨", 'author' => "纳兰性德〔清代〕", 'date' => "2022-04-02", 'content' => "为问封姨，何事却、排空卷地。又不是、江南春好，妒花天气。叶尽归鸦栖未得，带垂惊燕飘还起。甚天公、不肯惜愁人，添憔悴。搅一霎，灯前睡。听半晌，心如醉。倩碧纱遮断，画屏深翠。只影凄清残烛下，离魂飘缈秋空里。总随他、泊粉与飘香，真无谓。" ]; echo compress(json_encode($array, JSON_UNESCAPED_UNICODE)); // TZDLTsJQFEX/pWNNCHHk3xA10cRoYurImLRFQAoFguWhVnkoRQyP1leblkLir3DPub0jf8FzHTndZ+19dvaFoh6pxwfKroLxAP0ej4bfAQsj0ZmDp8P4RdlScufq4ekZITx6h4KH2hhWwUazMSyw+GmjtYjZz6kyJJvJZrczO9uZLGl7pyfqwYlK8v/An2WVJS0WVcD62Gg61pp8EoEVgONtNAPq1yy0sLuQJ78HVge7Ixgl5AK3mZo+PE/Qs//IL/ASSJoidLHfRucVVh2JhS48Gpg3eaklnrrpupt+UluD23fkhcKUkulFaiww7+CVzqKIXBjEWLTRoEoGNgos1IRTI53rCyhb/GEgPzamYJl4W5Vf1nlwDVEsS12b8OGYR77Q59ieSZcdg1/HwOfr/l/VV0h8KF3RYjiv8Pw9CysSc2MxM6gkX17zcYV2EKWqLKDF4q7O4rYc4d3kb2UW1ggT7q10OT3s9FPvhkjl8hc=
2、解压
<?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":"为问封姨，何事却、排空卷地。又不是、江南春好，妒花天气。叶尽归鸦栖未得，带垂惊燕飘还起。甚天公、不肯惜愁人，添憔悴。搅一霎，灯前睡。听半晌，心如醉。倩碧纱遮断，画屏深翠。只影凄清残烛下，离魂飘缈秋空里。总随他、泊粉与飘香，真无谓。"}
