Javascript - 将图像文件转换为 Base64 字符串数据时如何减小大小？

Question

此代码将图像文件转换为 Base64 字符串数据。 但是我想减小 base64 字符串的大小，因为我转换的 base64 字符串数据的大小比图像文件大。 那可能吗？

<input id="inputFileToLoad" type="file" accept="image/*" onchange="encodeImageFileAsURL();"/>
<div id="imgTest"></div>

<script type='text/javascript'>
  function encodeImageFileAsURL(){
    var filesSelected = document.getElementById("inputFileToLoad").files;
    var fileSize = filesSelected[0].size;
    if(fileSize < 10000000){
      if (filesSelected.length > 0){
        var fileToLoad = filesSelected[0];
        var fileReader = new FileReader();

        fileReader.onload = function (fileLoadedEvent){
          var srcData = fileLoadedEvent.target.result; // <--- data: base64
          var newImage = document.createElement('img');
          newImage.src = srcData;

          document.getElementById("imgTest").innerHTML = newImage.outerHTML;
          alert("Converted Base64 version is " + document.getElementById("imgTest").innerHTML);
        }
        fileReader.readAsDataURL(fileToLoad);
      }

    } else {
      alert("File exceeded"); 
      }
  }
</script>        

Answer 1

64 是 2^6（6 位）。 这意味着每个 char(8 位) 只包含 6 位信息。 因此，为了传达相同数量的信息，base64 需要比二进制多 33.3% 的位。

您唯一能做的就是在应用 base64 之前减小原始图像的大小，这将以相同的比例减小 base64 字符串的大小。