Req.file не определен при загрузке из ReactJS в NodeJS - PullRequest
Новая
       10

Req.file не определен при загрузке из ReactJS в NodeJS

0 голосов
/ 02 февраля 2019

Я пытаюсь отправить изображение в запросе POST от реакции на nodejs.Однако мой сервер не получает файл и req.file не определен.Когда я тестирую код загрузки изображений с сервера с почтальоном, все работает нормально, поэтому я подозреваю, что что-то не так в интерфейсе.Кто-нибудь знает, что не так?Вот мой код:

Image_Upload.js (отправить изображение func, fileList [0] - это изображение): 

 onSubmitImage = e => {
    const config = {
      headers: {
        "content-type": "multipart/form-data"
      }
    };
    const formData = new FormData();
    formData.append(
      "image",
      this.state.fileList[0]
    );
    axios
      .post("/api/profile/img_upload", formData)
      .then(res => console.log("Response: " + res))
      .catch(err => console.log(err.response.data));
  };

profile.js (получение конечной точки изображения): 

router.post(
  "/img_upload",
  passport.authenticate("jwt", { session: false }),
  (req, res) => {
    upload(req, res, err => {
      console.log(req);
      if (err) {
        res.status(400).json({ Error: err });
      } else {
        if (req.file == undefined) {
          res.status(404).json({ error: "no file selected" });
        } else {
          res.json({ fileLoc: req.file.location });
        }
      }
    });
  }
);

img_upload.js (настройка мультитера): 

const upload = multer({
  storage: storage,
  limits: { fileSize: 1000000 },
  fileFilter: function(req, file, cb) {
    checkFileType(file, cb);
  }
}).single("image");

Любая помощь приветствуется

РЕДАКТИРОВАТЬ: я замечаю, что когда nodejs получает запрос от внешнего интерфейса, этов req.body вместо req.file.Так что я уверен, что проблема в реакции.Как я могу отреагировать, чтобы отправить его как req.file вместо req.body? Запрос изображения от Reacdt Front-end до Nodejs backend

1 Ответ

0 голосов
/ 03 февраля 2019

upload, который вы определили, на самом деле является выраженным промежуточным ПО , которое должно принимать 3 аргумента: запрос, ответ и следующий, соответственно.next() вызывает последующее промежуточное программное обеспечение в случае отсутствия ошибок или next(error) в противном случае.Я настоятельно рекомендую проверить ответы на этот вопрос , чтобы получить лучшее представление.

То, что вы сделали здесь, это то, что вы вызываете промежуточное программное обеспечение, как если бы это был метод.Чтобы это исправить, сначала настройте multer 

const multer  = require('multer');
const upload = multer({
  storage: 'path/here/',
  limits: { fileSize: 1000000 },
  fileFilter: function(req, file, cb) {
    checkFileType(file, cb);
  }
});

, а затем 

router.post("/img_upload",
  passport.authenticate("jwt", { session: false }),
  upload.single('image'),
  (req, res) => {
  // Your code here
});
...