React Native POST“multipart form-data”500服务器错误答案

【问题标题】：React Native POST "multpart form-data" 500 server errorReact Native POST“multipart form-data”500服务器错误
【发布时间】：2020-01-28 22:06:51
【问题描述】：

当我尝试将图像发布到我的 Node/Express 服务器（部署在 Heroku 上）时，我收到 500 服务器错误。

通过 Postman 发布就可以了。

这是我的 React Native 代码：

upload = async uri => {
  const formData = new FormData();

  formData.append("photo", {
    uri,
    name: `photo`,
    type: `image/jpg`
  });

  const options = {
    method: "POST",
    body: formData,
    headers: {
      "Content-Type": "multipart/form-data"
    }
  };

  axios
    .post("https://prezzi-api.herokuapp.com/upload", formData, options)
    .then(response => {
      console.warn(response.data);
    })
    .catch(error => {
      console.warn("error uploading to OCR", error);
    });
};

我的 Express 路线如下所示：

router.post(
  "/",
  multer.single("image"),
  gcsMiddlewares.sendUploadToGCS,
  (req, res, next) => {
    console.log("post");
    if (req.file && req.file.gcsUrl) {
      return res.send(req.file.gcsUrl);
    }

    return res.status(500).send("Unable to upload");
  }
);

当我不使用 Postman 时，我的路由中的 console.log 不会被击中。

【问题讨论】：

标签： node.js react-native express post

【解决方案1】：

在您的上传函数中写入console.log({ uri }) 以了解你得到什么格式的uri
从选项中删除正文

【讨论】：

1) console.log 看起来像：Object { "uri": "file:///var/mobile/Containers/Data/Application/F4126F94-70FD-47A8-BC38-F2BD09215F0A/Library/Caches/ExponentExperienceData/%2540pivcec%252FPrezzi/Camera/03E523CD-748F-4808-8B7C-990CE2E003B6.jpg", } 2) 正文已从选项中删除 3) 服务器错误仍然存在

【解决方案2】：

我仔细查看了我的 Express 路由中的 res 对象，以了解有效和无效之间的区别，以下是 React Native 应用程序的最终结果：

      uploadToOCR = async uri => {
       const formData = new FormData();

       formData.append("image", {
         uri,
         name: "photo.jpg",
         type: "image/jpg",
         headers: {
           Accept: "application/json",
           "Content-Type": "multipart/form-data"
         }
       });

    const options = {
      method: "POST",
      body: formData
    };

    try {
      const response = await fetch(
        "https://prezzi-api.herokuapp.com/upload",
        options
      );
      if (response) {
        // const json = await response.json();
        // console.warn("json", json);
        console.warn("response", response);
      }
    } catch (error) {
      console.warn("error uploading to OCR", error);
    }
 };

【讨论】：