javascript - 无法使用 JavaScript 提取 API 发布数据

标签 javascript frontend fetch

我正在尝试使用 fetch API 将数据POST 到我的服务器,但每次我这样做都以空主体结束。

据我所知 fetch documentation , 要发布数据,您需要传递一个方法键设置为“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);
});

我在它的背后还有一个快速服务器,它记录请求正文并在响应中回显它。

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

我将 formData 添加为 fetch 请求的主体,但似乎什么都没有通过。

Please find my test files in this gist here并提供帮助!

最佳答案

这是因为您的节点服务器没有正确理解多部分表单(这是 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 工作,但我自己也不知道。

关于javascript - 无法使用 JavaScript 提取 API 发布数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36918287/

相关文章:

javascript - 我如何使用 JSLQ 获得最高记录?

html - Materialize.css 无法删除页脚和主体之间的空白区域。

javascript - 在 ReactJS 中从哪里发出初始 AJAX 请求

javascript - 如何在react js中的get过滤器中设置.val()?

javascript - Mongoose 。如何更新包含在另一个数组中的数组元素?

javascript - 以下 backbone.js 示例中的模型、 Controller 、 View 是什么?

html - BS 网格工作不相同

javascript - 当收到多个异步获取响应时,您如何选择您想要的响应(即用户请求的响应)?

javascript - 服务 worker 返回的 javascript 响应对象中的 json 内容

javascript - 使用javascript检测 session 是否过期