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

起因

在做项目的时候遇到了一个问题,需要用户上传一张图片在画布里操作,一般的逻辑是先传图片到服务器,然后从服务器读取这张图片,这过程中可能读取的时间会过长,而且服务器也没必要存操作前的图片,于是就需要本地读取图片(这里用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);
});

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值