السلام عليكم اتنمى تكونوا بخير،

عندي مشكله ان اما برفع بروجكت جديد وفيه صور او فيديوهات تقيله بيجيب الايروراللي في الاسكرين شوت، استخدمت Multer وBusboy والاتنين نفس المشكله هل في حل ممكن؟ اتمنى تفيدوني.

شكرا جدا ليكم.

---------------------------------------------------------------------------------------------------------------------------------------------------------------

كود الباك اند:

const express = require("express");
const Project = require("../models/projectModel");
const bucket = require("../firebase/firebaseConfig");
const Busboy = require("busboy");

const router = express.Router();

// API لرفع الملفات وحفظ البيانات
router.post("/create", (req, res) => {
  const busboy = Busboy({ headers: req.headers });
  const uploadedMediaUrls = [];
  let backgroundUrl = null;

  const fields = {};
  const promises = [];

  busboy.on("file", (fieldname, file, info) => {
    const { filename, encoding, mimeType } = info; 
    console.log(`Fieldname: ${fieldname}`);
    console.log(`Filename: ${filename}`);
    console.log(`Mimetype: ${mimeType}`);

    if (!filename) {
      return res.status(400).json({ message: "Filename is missing" });
    }

    const fileName =
      fieldname === "backgroundImg"
        ? `projects/backgrounds/${Date.now()}-${filename}`
        : `projects/media/${Date.now()}-${filename}`;
    console.log(`Uploading file: ${fileName} with mimetype: ${mimeType}`);
    const blob = bucket.file(fileName);

    const uploadPromise = new Promise((resolve, reject) => {
      const stream = blob.createWriteStream({
        metadata: { contentType: mimeType },
      });

      file.pipe(stream);

      stream.on("error", (err) => {
        console.error(`Stream error for file ${fileName}:`, err);
        reject(err);
      });
      stream.on("finish", async () => {
        try {
          await blob.makePublic();
          const publicUrl = `https://storage.googleapis.com/${bucket.name}/${blob.name}`;
          console.log(`File uploaded successfully: ${publicUrl}`);
          if (fieldname === "backgroundImg") {
            backgroundUrl = publicUrl;
          } else {
            uploadedMediaUrls.push(publicUrl);
          }
          resolve();
        } catch (err) {
          console.error(`Error making file public ${fileName}:`, err);
          reject(err);
        }
      });
    });

    promises.push(uploadPromise);
  });

  busboy.on("field", (fieldname, value) => {
    fields[fieldname] = value;
  });

  busboy.on("finish", async () => {
    try {
      await Promise.all(promises);

      if (!uploadedMediaUrls.length) {
        return res.status(400).json({ message: "No media files uploaded" });
      }

      if (!backgroundUrl) {
        return res
          .status(400)
          .json({ message: "Background image is required" });
      }

      const newProject = new Project({
        title: fields.title,
        description: fields.description,
        tags: fields.tags ? fields.tags.split(",") : [],
        about: fields.about,
        imageUrls: uploadedMediaUrls,
        category: fields.category,
        backgroundImg: backgroundUrl,
        pageColor: fields.pageColor,
        textColor: fields.textColor,
        bgTagsColor: fields.bgTagsColor,
        textTagsColor: fields.textTagsColor,
      });

      await newProject.save();

      res.status(201).json({
        message: "Project created successfully!",
        project: newProject,
      });
    } catch (err) {
      console.error(err);
      res
        .status(500)
        .json({ message: "Something went wrong", error: err.message });
    }
  });

  req.pipe(busboy);
});

// الحصول على جميع المشاريع
router.get("/all", async (req, res) => {
  try {
    const projects = await Project.find();
    res.status(200).json(projects);
  } catch (error) {
    res.status(500).json({ message: "Error fetching projects", error });
  }
});

// الحصول على مشروع محدد
router.get("/:id", async (req, res) => {
  try {
    const project = await Project.findById(req.params.id);
    if (!project) {
      return res.status(404).json({ message: "Project not found" });
    }
    res.status(200).json(project);
  } catch (error) {
    res.status(500).json({ message: "Error fetching project", error });
  }
});

// حذف مشروع محدد
router.delete("/delete/:id", async (req, res) => {
  try {
    const project = await Project.findByIdAndDelete(req.params.id);
    if (!project) {
      return res.status(404).json({ message: "Project not found" });
    }
    res.status(200).json({ message: "Project deleted successfully" });
  } catch (error) {
    res.status(500).json({ message: "Error deleting project", error });
  }
});

module.exports = router;

---------------------------------------------------------------------------------------------------------------------------------------------------------------

كود زرار الكرييت:

  const handleSubmit = async (e) => {
    e.preventDefault();
    const fd = new FormData();

    Object.entries(formData).forEach(([key, value]) => {
      if (Array.isArray(value)) {
        value.forEach((item) => fd.append(key, item));
      } else {
        fd.append(key, value);
      }
    });

    setFeedback({
      success: null,
      error: null,
      uploading: true,
    });

    try {
      const res = await axios.post(`${secretApiLink}/projects/create`, fd, {
        withCredentials: true,
        headers: {
          "Content-Type": "multipart/form-data",
        },
      });
      setFeedback({
        success: "Project created successfully",
        error: null,
        uploading: false,
      });
      setFormData({
        title: "",
        description: "",
        tagInput: "",
        tags: [],
        category: "",
        about: "",
        images: [],
        backgroundImg: null,
        pageColor: "ffffff",
        textColor: "000000",
        bgTagsColor: "efefef",
        textTagsColor: "000000",
      });
      setTimeout(() => setCreateProject(false), 1000);
      fetchProjects();
    } catch (error) {
      setFeedback({
        success: null,
        error: `Error creating project: ${error}`,
        uploading: false,
      });
    }
  };

---------------------------------------------------------------------------------------------------------------------------------------------------------------

الاسكرين شوت:

المجتمع الأكبر للعرب في مجال التك

5 ردود