图片各格式之间的相互转换

贴代码imgformat-deal.js

/**
 * 图片file格式转为base64
 * fileToBase64(file).then((res) => {console.log(res.data)})
 */
export function fileToBase64(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = function (e) {
      // e.target.result 即为base64结果
      let resData = e.target.result;
      resolve({ data: resData });
    };
  });
}

/**
 * 图片file格式转为blob
 * fileToBlob(file).then((res) => {console.log(res.data)})
 */
export function fileToBlob(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = function (e) {
      const type = file.type;
      let resData = new Blob([e.target.result], { type });
      resolve({ data: resData });
    };
  });
}

/**
 * 图片base64格式转为file
 * base64ToFile(base64,fileName).then((res) => {console.log(res.data)})
 */
export function base64ToFile(base64, fileName) {
  return new Promise((resolve, reject) => {
    // 分割base64
    let arr = base64.split(',');
    // 获取类型
    let mime = arr[0].match(/:(.*?);/)[1] || type;
    // 去掉url的头，并转化为byte
    let bytes = window.atob(arr[1]);
    let n = new ArrayBuffer(bytes.length);
    let u8arr = new Uint8Array(n);
    while (n--) {
      u8arr[n] = bytes.charCodeAt(n);
    }
    let resData = new File([u8arr], fileName, { type: mime });
    resolve({ data: resData });
  });
}

/**
 * 图片base64格式转为blob
 * base64ToBlob(base64).then((res) => {console.log(res.data)})
 */
export function base64ToBlob(base64) {
  return new Promise((resolve, reject) => {
    // 分割base64
    let arr = base64.split(',');
    // 获取类型
    let mime = arr[0].match(/:(.*?);/)[1] || type;
    // 去掉url的头，并转化为byte
    let bytes = window.atob(arr[1]);
    let n = new ArrayBuffer(bytes.length);
    let u8arr = new Uint8Array(n);
    while (n--) {
      u8arr[n] = bytes.charCodeAt(n);
    }
    let resData = new Blob([u8arr], { type: mime });
    resolve({ data: resData });
  });
}

/**
 * 图片blob格式转为file
 * blobToFile(blob,fileName).then((res) => {console.log(res.data)})
 */
export function blobToFile(blob, fileName) {
  return new Promise((resolve, reject) => {
    let resData = new File([blob], fileName, { type: blob.type });
    resolve({ data: resData });
  });
}

/**
 * 图片blob格式转为Base64
 * blobToBase64(blob).then((res) => {console.log(res.data)})
 */
export function blobToBase64(blob) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(blob);
    reader.onload = (e) => {
      let resData = e.target.result;
      resolve({ data: resData });
    };
  });
}

/**
 * 图片base64格式转为arrayBuffer
 * base64ToArrayBuffer(base64String).then((res) => {console.log(res.data)})
 */
export function base64ToArrayBuffer(base64String) {
  return new Promise((resolve, reject) => {
    const padding = '='.repeat((4 - (base64String.length % 4)) % 4);
    const base64 = (base64String + padding).replace(/\-/g, '+').replace(/_/g, '/');

    const rawData = window.atob(base64);
    const resData = new Uint8Array(rawData.length);

    for (let i = 0; i < rawData.length; ++i) {
      resData[i] = rawData.charCodeAt(i);
    }
    resolve({ data: resData });
  });
}

/**
 * 图片arrayBuffer格式转为base64
 * arrayBufferToBase64(buffer).then((res) => {console.log(res.data)})
 */
export function arrayBufferToBase64(buffer) {
  return new Promise((resolve, reject) => {
    let binary = '';
    let bytes = new Uint8Array(buffer);
    let len = bytes.byteLength;
    for (let i = 0; i < len; i++) {
      binary += String.fromCharCode(bytes[i]);
    }
    let resData = window.btoa(binary);
    resolve({ data: resData });
  });
}