tiefen_space_web/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);
  });
}

//上传单张图片
export async function uploadImage(asset) {
  const auth = await getAuth(1);
  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);

    const uploadResponse = await fetch(auth.host, {
      method: "POST",
      body: formData,
    });

    if (uploadResponse.status === 200) {
      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 signature = generateSignature({
        mtype: 1,
        item: item,
        ...base,
      });
      const response = await fetch(
        `/api/media/c_upload?signature=${signature}`,
        {
          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 multiUploadImage(assets) {
  let ids = { image_ids: [], video_ids: [] };
  await Promise.all(
    assets.map(async (asset) => {
      const id = await uploadImage(asset);
      ids.image_ids.push(id);
    })
  );
  return ids;
}