图片网络地址转base64和文件

最新推荐文章于 2024-05-31 09:05:13 发布

AAAA...初识

最新推荐文章于 2024-05-31 09:05:13 发布

阅读量393

点赞数

文章标签： html5 前端 javascript

本文链接：https://blog.csdn.net/weixin_44156462/article/details/121543109

版权

//图片地址转base64格式
    imgToBase64(url,cb){
      var canvas = document.createElement('canvas'),
        ctx = canvas.getContext('2d'),
      img = new Image;
      
      img.crossOrigin = 'Anonymous';
      img.onload = function () {
        canvas.height = img.height;
        canvas.width = img.width;
        ctx.drawImage(img, 0, 0);
        var dataURL = canvas.toDataURL('image/png');
         console.log(dataURL)   //Base64  码  一般用这个就行
        cb && cb(dataURL);
        canvas = null;
      };
      img.src = url;
    },
    //base64转file对象
    base64toFile(base, filename){
      var arr = base.split(',');
      var mime = arr[0].match(/:(.*?);/)[1];
      var suffix = mime.split("/")[1];
      var bstr = atob(arr[1]);
      var n = bstr.length;
      var u8arr = new Uint8Array(n);
      while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
      }
      //转换成file对象
      return new File([u8arr], `${filename}.${suffix}`, { type: mime });
    },
//使用
this.imgToBase64(imgUrl,base =>{
            let file = this.base64toFile(base,'图片')
       })