美文网首页
使用原生js以base64读取本地图片文件

使用原生js以base64读取本地图片文件

作者: leenty | 来源:发表于2016-06-08 16:42 被阅读737次

起因

在做项目的时候遇到了一个问题,需要用户上传一张图片在画布里操作,一般的逻辑是先传图片到服务器,然后从服务器读取这张图片,这过程中可能读取的时间会过长,而且服务器也没必要存操作前的图片,于是就需要本地读取图片(这里用base64的格式)。
这里为了备忘,记录下。

代码

File.prototype.convertToBase64 = function(callback){
    var FR= new FileReader();
    FR.onload = function(e) {
         callback(e.target.result)
    };       
    FR.readAsDataURL(this);
  }

使用方法

document.querySelector('[type="file"]').files[0].convertToBase64(function(base64){
    console.log(base64);
});

相关文章

网友评论

      本文标题:使用原生js以base64读取本地图片文件

      本文链接:https://www.haomeiwen.com/subject/xzyjdttx.html