json到base64的转换

问题描述

我一直在寻找将我的base64更改为JSON的pako，我可以完美地工作。但是我该如何扭转呢？

我已将在线JSON用作base64，但结果与我最初输入的原始base64不同。

在此代码段的注释中，我留下了base64的样本及其输出（也已注释）。我可以使用pako将其恢复为原始状态吗？

//eNqrVsoozcnxdFGyMjQwtjQwN9dRSq0oSC0qcSrNzElrskpLzClO1VEqT00syM8rVrKKNjUwMInVUSouSE3OBMpBRCxBItmZYAWGBgZmIINiawE68xw1
//{"hullID":1039077,"expertBuild":false,"weapons":[5004],"specials":[5009],"skins":[10069077]}   
    
submit.onclick = function(){
  // Get some base64 
  var b64Data     = document.getElementById("KixCode").value;;
  // Decode base64 (convert ascii to binary)
  var strData     = atob(b64Data);
  // Convert binary string to character-number array
  var charData    = strData.split('').map(function(x){return x.charCodeAt(0);});
  // Turn number array into byte-array
  var binData     = new Uint8Array(charData);
  // Pako magic
  var data        = pako.inflate(binData);
  // Convert gunzipped byteArray back to ascii string:
  var strData     = String.fromCharCode.apply(null,new Uint16Array(data));
  // Output 
  var KixCode = strData
  document.getElementById("output").innerText = KixCode;
}

<div>
<label for="KixCode">Kix Code: </label><input id="KixCode" type="text" value="eNqrVsoozcnxdFGyMjQwtjQwN9dRSq0oSC0qcSrNzElrskpLzClO1VEqT00syM8rVrKKNjUwMInVUSouSE3OBMpBRCxBItmZYAWGBgZmIINiawE68xw1"/><br /><br />
<button id="submit">Submit</button>
</div>
<p>
<span id="output"></span>
</p>

<script src="https://rawgit.com/nodeca/pako/master/dist/pako.js"></script>

解决方法

您可以使用pako的deflate方法。问题在于，编码数据具有一些标头信息，这些标头信息提供有关如何执行压缩的信息。减压（inflate）的结果中不包含此信息。

您的示例数据原来已被7级压缩，但是deflate方法的默认值为6级。这导致deflate返回的第二个字节有所不同，当与传递给inflate的数据的第二个字节进行比较。第二个字节是header的一部分。

NB：我不熟悉所有这些内容，我只是提供以上内容供您进一步分析。重要的是，选项会影响压缩的执行方式。

以您的示例为例，将选项{ level: 7 }传递给deflate方法将得到与最初将其传递给inflate一样的结果：

submit.onclick = function(){
    var b64Data     = document.getElementById("KixCode").value;
    var strData     = atob(b64Data);
    var charData    = Array.from(strData,x => x.charCodeAt(0));
    var binData     = new Uint8Array(charData);
    var data        = pako.inflate(binData);
    var KixCode     = String.fromCharCode.apply(null,new Uint16Array(data));
    document.getElementById("output").innerText = KixCode;
    
    // Reverse operation
    var data2       = Array.from(KixCode,c => c.charCodeAt());
    var binData2    = pako.deflate(data2,{ level: 7 }); // <-- option
    var charData2   = [...binData2];
    var strData2    = charData2.map(i => String.fromCharCode(i)).join("");
    var b64Data2    = btoa(strData2);
    
    document.getElementById("verif").innerText = b64Data2 === b64Data ? "Reversal is correct" : "Reversal is not the same";
}

<div><label for="KixCode">Kix Code: </label><input id="KixCode" type="text" style="width: 100%" value="eNqrVsoozcnxdFGyMjQwtjQwN9dRSq0oSC0qcSrNzElRskpLzClO1VEqT00syM8rVrKKNjUwMInVUSouSE3OBMpBRCxBItmZYAWGBgZmIINiawE68xw1"></div>
<div><button id="submit">Submit</button></div>
<div id="output"></div>
<div id="verif"></div>


<script src="https://cdnjs.cloudflare.com/ajax/libs/pako/1.0.11/pako.min.js" integrity="sha512-euWc/Qv8Kp0CbTX1M+Q3BvUyoOaq9Au50TT7vz3MFf5ver39ybq6zV+RngDY8eN8AIQFigxjwYv6jhoP546vfQ==" crossorigin="anonymous"></script>