js图片转blob

// 假设我们有一个图片的URL
const imageUrl = 'https://example.com/image.jpg';

// 创建一个新的Image对象
const image = new Image();

// 设置跨域属性，如果图片来自不同的域
image.crossOrigin = 'Anonymous';

// 当图片加载完成时执行回调
image.onload = function() {
  // 创建一个canvas元素
  const canvas = document.createElement('canvas');
  canvas.width = image.width;
  canvas.height = image.height;

  // 获取2D上下文
  const ctx = canvas.getContext('2d');

  // 将图片绘制到canvas上
  ctx.drawImage(image, 0, 0);

  // 将canvas内容转换为Blob对象
  canvas.toBlob(function(blob) {
    // 这里的blob就是图片的Blob对象
    console.log(blob);

    // 如果你需要一个URL来预览这个Blob对象
    const url = URL.createObjectURL(blob);
    console.log(url);

    // 使用完毕后释放URL对象
    // URL.revokeObjectURL(url);
  }, 'image/jpeg'); // 可以指定图片的MIME类型
};

// 设置图片的src属性开始加载图片
image.src = imageUrl;