无法使用JavaScript fetch API发送POST数据

Question

我正在使用fetch API向我的服务器发送数据，但每次都会得到一个空的主体。根据fetch文档的说法，要发布数据，您需要传递一个包含一个方法键设置为“POST”和一个字符串或FormData对象（或其他一些对象）的对象。下面是一个简单的示例，但它没有按照我期望的工作：

var formData = new FormData();
formData.append("test", "woohoo");
formData.append("foo", "bar")
// prints out contents of formData to show that it has contents!
formData.forEach(function(key, value) {
  console.log(`${key}: ${value}`);
});

fetch("/fetch", {
  method: "POST",
  body: formData
}).then(function(response) {
  return response.json();
}).then(function(json) {
  // Logs empty object
  console.log(json);
}).catch(function(err) {
  console.log(err);
});

我还在后台拥有一个express服务器，用于记录请求体并在响应中回显它。

app.post("/fetch", function(req, res) {
  // Logs empty object :(
  console.log(req.body);
  res.send(JSON.stringify(req.body));
});

我将formData作为fetch请求的正文，但似乎没有任何东西通过。请在此处查看我的测试文件并帮助！

- philnash

---

我相信你漏掉了 throw new TennisBall()，这就是你需要的来取球。 :) - markthethomas

Answer 1

这是因为你的节点服务器没有正确理解多部分表单（这是默认情况下 FormData 发送的内容）。

您可以在服务器上使用node-muliparty，轻松读取表单，而无需触及前端代码。

类似于：

var multiparty = require('multiparty');
var app = express();

app.post("/fetch", function(req, res) {
  var form = new multiparty.Form();

  form.parse(req, function(err, fields, files) {
    console.log(fields);
    res.send(JSON.stringify(fields));
  });
});

在您的index.js中，将会展示正确的工作方式。也许有一种方法可以与body-parser一起使用，但我自己不知道如何实现。

- edds