使用js或jquery对图像进行编码

Question

我是计算机科学方面的新手。我看到开发者在图片标签data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAAQABAAD/2..../AI7/AP/Z中使用了一些东西。

因此，我的问题是，当用户上传图像时，我该如何处理，并且可以使用js或jquery框架在这种类型的代码data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAAQABAAD/2..../AI7/AP/Z中进行更改。并在加载后在浏览器上打印。我必须使用任何函数吗？我是否必须使用任何特定的标签，如canvas或svg？

Answer 1

您尝试获取的字符串是图像的base64表示形式。任何文件或文件都可以转换为base64。

有关base64的更多信息，请访问此处：https://en.wikipedia.org/wiki/Base64

关于将图像转换为base64，已经在这里回答了：How to convert image into base64 string using javascript

而且，这也不是通常的要求。通常，一些服务器端语言，如PHP是用来做这件事的。

Answer 2

我发现这是如何可能的，这是一个小演示…

​

$(document).ready(function() {
  function readImage() {
    if (this.files && this.files[0]) {
      var base24 = new FileReader();
      base24.onload = function(e) {
        $('#encoded').text(e.target.result);
      };
      base24.readAsDataURL(this.files[0]);
    }
  }

  $("#myimage").change(readImage);

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type='file' id="myimage" />
<div id="encoded"></div>

​