如何在不使用canvas的情况下将正常图片url转成blob格式的url？

Question

有大佬知道的吗？

Answer 1

获取文件对象的blob路径：

getObjectURL(file) {
  let url = null
  if (window.createObjectURL !== undefined) {
    // basic
    url = window.createObjectURL(file)
  } else if (window.webkitURL !== undefined) {
    // webkit or chrome
    url = window.webkitURL.createObjectURL(file)
  } else if (window.URL !== undefined) {
    // mozilla(firefox)
    url = window.URL.createObjectURL(file)
  }
  return url // blob url
}

Answer 2

用xhr。

仅限同源图片

  const xhr = new XMLHttpRequest();
  xhr.withCredentials = true;

  xhr.addEventListener('readystatechange', function() {
    if (this.readyState === 4) {
      console.log(this.response); // blob
      const blob_url = URL.createObjectURL(this.response);
      const img = new Image();
      img.src = blob_url;
      document.body.appendChild(img);
    }
  });

  xhr.open('get', './1.jpg');
  xhr.responseType = 'blob';

  xhr.send();