js图片格式转换(File、blob、二进制)

一、首先知道你要转换的编码格式:

log一下就能看到:

Blob:

 二进制

 File

 二、File转Blob

// 原生
<input class="ut myHide" id="uploadFile" name="uploadFile" type="file" onchange="btnUploadFile(event)" /> 

function btnUploadFile(e){
     //获取图片文件 
      var imgFile = e.target.files[0]; 
      var imgBlob = URL.createObjectURL(imgFile ); 
}

三、Blob转File(详见:使用js将blob对象转file对象_x先生的博客-CSDN博客_blob转file)

var imgBlob = Blob格式图片

var imgFile = new window.File([imgBlob], Math.random(), {
          type: imgBlob.type,
        });

四、Blob 转 二进制(base64)

获取 img 的 dom,这里命名为 img

 function base64 (dom) {
  const canvas = document.createElement('canvas')
  const ctx = canvas.getContext('2d')
  canvas.width = dom.width
  canvas.height = dom.height
  ctx?.drawImage(dom, 0, 0, dom.width, dom.height)
  return canvas.toDataURL('image/png')
 }

、后面用到再写

  • 6
    点赞
  • 28
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值