Передача формы с вводом файла и другими входами - PullRequest
0 голосов
/ 12 мая 2019

Я хочу загрузить файл с другими данными формы.но когда я загружаю файл с другим маршрутом, таким как router.post (/ api / upload) ", это работает, но я хочу загрузить файл вместе с другими данными формы для маршрутизации, как route.post ('/ api / жалоб') и т. д., нокогда я делаю с route.post ('/ api / жалоб'), «req.file» не определен, но когда я делаю с router.post (/ api / upload), он загружается. Пожалуйста, помогите.

это настройка мультитера

const upload = multer({
  limits: {
    fileSize: 10000000
  },
  fileFilter(req, file, cb) {
    if (!file.originalname.match(/\.(jpg|jpeg|png)$/)) {
      return cb(new Error("File must be .jpg | .jpeg | .png"));
    }
    cb(undefined, true);
  }
});

это маршрут для загрузки файла.

router.post(
  "/upload",
  upload.single("complaint"),
  async (req, res) => {
    // req.file.buffer;
    res.status(200).send("file uploaded successfully." + req.file.buffer);
  },
  (error, req, res, next) => {
    res.status(400).send({ error: error.message });
  }
);

это маршрут для публикации всех данных формы. Проблема здесь. Здесь req.fileне определено.

router.post(
  "/",
  authComplainer,
  upload.single("complaint"),
  async (req, res) => {

    const category = await Category.findById(req.body.categoryId);

    if (!category) return res.status(400).send("Invalid category.");

    const assignee = await Assignee.findOne({
      responsibility: category
    });
    if (!assignee) return res.status(400).send("Invalid Assignee.");

    const complainer = await Complainer.findById(req.complainer._id);
    if (!complainer) return res.status(400).send("Invalid Complainer.");

    let complaint = new Complaint({
      category: {
        _id: category._id
      },
      complainer: {
        _id: complainer._id
      },
      assignedTo: {
        _id: assignee._id
      },
      geolocation: req.body.geolocation ? req.body.geolocation : "",
      details: req.body.details,
      title: req.body.title,
      location: req.body.location,
      image: req.file ? req.file.buffer : ""
    });

    await complaint.save();
    res.send(complaint);

это мой код реагирования

 handleFileChange = e => {
    // if (this.checkMimeType(e)) {
    this.setState({ selectedFile: e.target.files[0] });
}

doSubmit = async () => {
    this.setState({ isDialogOpen: false });
    this.setState({ isLoading: true });

    const data = new FormData();
    data.append(
      "complaint",
      this.state.selectedFile,
      this.state.selectedFile.name
    );

    const newState = { ...this.state.data, data };
    console.log(newState);

    const { data: result } = await saveComplaint(this.state.data);
    this.setState({ isLoading: false });

    console.log(result);
    toast.success("Complaint is successfully registered.");
    // this.props.history.replace("/complainer");
   };

Я хочу загрузить файл вместе с другими данными формы, такими как тип ввода текста и т. д., но он не работает. Пожалуйста, помогите.Основная проблема в React.js коде. Файл req.file не определен при отправке из приложения React. Когда я тестировал его из Postmon. Он работает в обоих сценариях

1 Ответ

0 голосов
/ 12 мая 2019

Итак, если вы уже определили эту «проблему, если в React.js», то вместо этого подайте проблему в github React!

...