将文件从 React 上传到远程服务器

Question

我正在尝试以各种方式上传文件，但无法正常工作。客户端代码如下所示：

 var image = document.getElementById("upload").files[0];

我正在以这种方式抓取文件，我控制台记录它并且它工作正常。

  const request = axios.post(PROJECTS_URL, {avatar: image});

我发送 post 请求并获得状态 500。当我将 post 请求的主体更改为仅文本，并编辑服务器以接收文本时，它工作正常。

我也试过这个：

var formData = new FormData();
formData.append("avatar", image, image.name)
const request = axios.post(PROJECTS_URL, formData);

对于服务器端代码，我使用的是 multer，它看起来像这样：

app.post("/api", upload.single("avatar"), (req, res) => {

var entry = new Entry({
    img: req.file.path
})

entry.save().then((data) => {
    res.status(200).send(data)
}, (e) => {
    res.send(e)
})
})

我设置了 multer 中间件，只是不包括它。我正在尝试将图像上传到 mongodb 数据库，以便稍后在客户端使用图像 url。我真的被困在这里，非常感谢任何建议。

在我的 chrom 控制台中，我看到了内容类型：multipart/form-data； boundary=----WebKitFormBoundarye2QF7dzzJWEGUjJE; 边界部分是什么，是否阻止我提交表单？

Answer 1

所以问题出在我的服务器上，我没有将上传文件推送到 git。查看 heroku 上的日志很有帮助，我从那里收到一条错误消息 "no such file or directory"。我一直在使用 git commit -am 命令，以至于我忘了检查 git 状态，然后我上传了上传文件。

将文件从 React 上传到远程服务器

Uploading a file from react to remote server

node.js

reactjs

multer