如何使用输入类型文件对上传的文件进行编码和解码答案

【问题标题】：How to encode and decode the uploaded file using input type file如何使用输入类型文件对上传的文件进行编码和解码
【发布时间】：2016-08-17 06:45:13
【问题描述】：

我为用户创建了多个文件上传选项。我想对上传的文件进行编码和解码...这里我编写了将图像转换为base64字符串的程序...如何使用base64对文件进行编码和解码。

我的代码是

<html>
<body>

<input id="inputFileToLoad" type="file" onchange="encodeImageFileAsURL();" multiple />
<div id="imgTest"></div>
<script type='text/javascript'>
  function encodeImageFileAsURL() {

    var filesSelected = document.getElementById("inputFileToLoad").files;
    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);
        var reslut =    document.getElementById("imgTest").innerHTML; 
        console.log("Converted Base64 version is " +reslut);

      }
      fileReader.readAsDataURL(fileToLoad);
    }
  }
</script>
</body>
</html>

在控制台中我打印文件的编码值...如何使用控制台输出进行解码。

【问题讨论】：

你的预期输出是什么？
控制台输出编码值。 base64 像 Base64 版本是
如何将编码值存储在变量中。我再次解码存储值仅显示上传图像的缩略图

标签： javascript encoding base64

【解决方案1】：

试试window.atob(base64string)，我认为它是一个blob对象的utf8字符串

【讨论】：