tiefen_space_h5/utils/upload.js

"use client";
import baseRequest from "./baseRequest";
import CryptoJS from "crypto-js";
import { Toast } from "antd-mobile";
import { generateSignature } from "@/utils/crypto";

//获取auth
async function getAuth(mtype) {
  const base = baseRequest();
  const signature = generateSignature({
    mtype: mtype,
    ...base,
  });
  try {
    const response = await fetch(`/api/media/auth?signature=${signature}`, {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
      },
      body: JSON.stringify({
        mtype: mtype,
        ...base,
      }),
    });
    const data = await response.json();
    if (data.ret === -1) {
      Toast.show({
        content: data.msg,
      });
      return;
    }
    return data.data.policy_token;
  } catch (error) {
    console.error(error);
  }
}

//计算媒体参数
async function calculateFileMetadata(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();

    reader.onload = (event) => {
      try {
        const fileData = event.target.result;
        const wordArray = CryptoJS.lib.WordArray.create(fileData);
        const md5Hash = CryptoJS.MD5(wordArray).toString();

        const mediaElement = document.createElement(
          file.type.startsWith("image/") ? "img" : "video"
        );
        mediaElement.src = URL.createObjectURL(file);

        mediaElement.addEventListener(
          file.type.startsWith("image/") ? "load" : "loadedmetadata",
          () => {
            const metadata = {
              md5Hash,
              width: mediaElement.width || 0,
              height: mediaElement.height || 0,
              duration: mediaElement.duration || 0,
            };

            resolve(metadata);
          }
        );

        mediaElement.addEventListener("error", () => {
          const metadata = {
            md5Hash,
            width: 0,
            height: 0,
            duration: 0,
          };

          resolve(metadata);
        });
      } catch (error) {
        reject(error);
      }
    };

    reader.onerror = (error) => {
      reject(error);
    };

    file.type?.startsWith("image/")
      ? reader.readAsDataURL(file)
      : reader.readAsArrayBuffer(file);
  });
}

//获取上传失败时返回的id
async function getFailId() {
  const base = await baseRequest();
  const signature = await generateSignature({
    ...base,
  });
  try {
    const response = await fetch(
      `/api/upload_media_fail_config/list?signature=${signature}`,
      {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
        },
        body: JSON.stringify({
          ...base,
        }),
      }
    );
    const data = await response.json();
    if (data.ret === -1) {
      Toast.show({
        type: "error",
        text1: data.msg,
        topOffset: 60,
      });
      return;
    }
    return data.data;
  } catch (e) {
    console.warn(e);
  }
}

//上传单张图片
export async function uploadImage(asset) {
  const auth = await getAuth(1);
  // console.log("auth", auth);
  try {
    const formData = new FormData();
    formData.append("name", auth.filename);
    formData.append("policy", auth.policy);
    formData.append("OSSAccessKeyId", auth.access_key_id);
    formData.append("success_action_status", "200");
    formData.append("signature", auth.signature);
    formData.append("key", auth.directory + "/" + auth.filename);
    formData.append("file", asset);
    // console.log("formData", ...formData);
    const uploadResponse = await fetch(auth.host, {
      method: "POST",
      body: formData,
    });
    // console.log("uploadResponse", uploadResponse);
    if (uploadResponse.status === 200) {
      // console.log(asset);
      // debugger
      const info = await calculateFileMetadata(asset);
      const item = {
        src_id: auth.directory + "/" + auth.filename,
        md5: info.md5Hash,
        h: info.height,
        w: info.width,
        fmt: asset.type,
      };

      const base = baseRequest();
      const response = await fetch(`/api/media/c_upload`, {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
        },
        body: JSON.stringify({
          mtype: 1,
          item: item,
          ...base,
        }),
      });
      const data = await response.json();
      if (data.ret === -1) {
        Toast.show({
          content: data.msg,
        });
        return;
      }
      return data.data.ret_item.id;
    } else {
      Toast.show({
        content: "上传图片失败",
      });
    }
  } catch (error) {
    // console.log("Error occurred while getting or uploading data:", error);
  }
}

//上传单个视频
export async function uploadVideo(asset) {
  const auth = await getAuth(2);
  const fileType = asset?.type;
  const generateThumbnail = async () => {
    try {
      const videoCover = await VideoThumbnails.getThumbnailAsync(asset?.uri);
      return videoCover;
    } catch (e) {
      console.warn(e);
    }
  };
  try {
    const formData = new FormData();
    formData.append("name", auth.filename);
    formData.append("policy", auth.policy);
    formData.append("OSSAccessKeyId", auth.access_key_id);
    formData.append("success_action_status", "200");
    formData.append("signature", auth.signature);
    formData.append("key", auth.directory + "/" + auth.filename);
    formData.append("file", {
      uri: asset?.uri,
      name: asset?.filename,
      type: fileType,
    });

    const uploadResponse = await fetch(auth.host, {
      method: "POST",
      body: formData,
    });
    // console.log("uploadResponse", uploadResponse);
    if (uploadResponse.status === 200) {
      const md5 = uploadResponse.headers.map.etag.substring(
        1,
        uploadResponse.headers.map.etag.length - 1
      );
      const videoCover = await generateThumbnail();
      const videoCoverId = await uploadImage(videoCover);
      const item = {
        src_id: auth.directory + "/" + auth.filename,
        cover_id: videoCoverId,
        md5: md5,
        dur: asset?.duration,
        fmt: fileType,
      };
      const base = baseRequest();
      const response = await fetch(`/api/media/c_upload`, {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
        },
        body: JSON.stringify({
          mtype: 2,
          item: item,
          ...base,
        }),
      });
      const data = await response.json();
      if (data.ret === -1) {
        Toast.show({
          type: "error",
          text1: data.msg,
          topOffset: 60,
        });
        return;
      }
      return data.data.ret_item.id;
    } else {
      Toast.show({
        type: "error",
        text1: "上传视频失败",
        topOffset: 60,
      });
      const failId = await getFailId();
      return failId?.video_id_for_upload_fail;
    }
  } catch (error) {
    // console.log("Error occurred while getting or uploading data:", error);
    Toast.show({
      type: "error",
      text1: "上传视频失败",
      topOffset: 60,
    });
    const failId = await getFailId();
    return failId?.video_id_for_upload_fail;
  }
}

//上传多个图片
export async function multiUploadImage(assets) {
  // console.log("assets", assets);
  let ids = { image_ids: [], video_ids: [] };
  await Promise.all(
    assets.map(async (asset) => {
      const id = await uploadImage(asset);
      // debugger;
      ids.image_ids.push(id);
    })
  );

  return ids;
}