圖片URL轉BOLB BOLB轉文件

getUrlBolb(url) {
  let reader = new FileReader();
  this.imageToBlob(url, (blob) => {
    reader.readAsDataURL(blob);
  });
  reader.onload = (e) => {
  console.log(e)
dataURLtoFile(e.target.result, name) {//將base64轉換爲文件
  var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
      bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
  while(n--){
      u8arr[n] = bstr.charCodeAt(n);
  }
  return new File([u8arr], filename, {type:mime});
}

})}

imageToCanvas(src, cb) {
  let canvas = document.createElement('CANVAS');
  let ctx = canvas.getContext('2d');
  let img = new Image();
  img.src = src;
  img.setAttribute('crossOrigin', 'anonymous')
  img.onload = function () {
    canvas.width = img.width;
    canvas.height = img.height;
    ctx.drawImage(img, 0, 0);
    cb(canvas);
  };
},
dataURLToBlob(dataurl) {
  let arr = dataurl.split(',');
  let mime = arr[0].match(/:(.*?);/)[1];
  let bstr = atob(arr[1]);
  let n = bstr.length;
  let u8arr = new Uint8Array(n);
  while (n--) {
    u8arr[n] = bstr.charCodeAt(n);
  }
  return new Blob([u8arr], {type: mime});
},
canvasToDataURL(canvas, format, quality) {
  return canvas.toDataURL(format || 'image/jpeg', quality || 1.0);
},
imageToBlob(src, cb) {
  this.imageToCanvas(src, canvas => {
    cb(this.dataURLToBlob(this.canvasToDataURL(canvas)));
  });
},
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章