Question

我从库中获得了这段代码，我想将图像部分转换为base64。

但是我在将blob转换为base64时仍然会出错。

这是设备上托管的本地html文件。

      <div class="widget file-picker"><input class="ignore fake-file-input"
      placeholder="Click here to upload file. (< 5MB)" readonly=""><button class="btn-icon-only btn-reset"
      aria-label="reset" type="button"><i class="icon icon-refresh"> </i></button><a
      class="btn-icon-only btn-download" aria-label="download"
      download="image-1562651713366.jpg389038873-13_55_28.jpg"
      href="blob:file:///3efb6b21-718c-48d2-8fa1-f59520228804"><i class="icon icon-download"> </i></a>
    <div class="file-feedback "></div>
    <div class="file-preview"><img src="blob:file:///3efb6b21-718c-48d2-8fa1-f59520228804"></div>
  </div>

以下是将img转换为base64的示例代码。似乎不适用于Blob网址。

var someimage = $(".file-preview").find("img");
var canvas = document.createElement("canvas");
canvas.width = someimage.width;
canvas.height = someimage.height;
canvas.getContext("2d").drawImage(someimage, 0, 0);
dataURI = canvas.toDataURL();

Answer 1

已更新，以合并来自Rory McCrossan的评论

等待图像加载，并注意someimage是jQuery对象

var someimage = $(".file-preview").find("img");
someimg.on("load", function () { 
    var canvas = document.createElement("canvas");
    canvas.width = someimage.width;
    canvas.height = someimage.height;
    canvas.getContext("2d").drawImage(someimage[0], 0, 0);
    dataURI = canvas.toDataURL();
}

将图片Blob网址转换为base64

1 个答案: