对Express.js的fetch()POST请求生成空主体{}

时间:2018-10-07 00:07:32

标签: javascript express fetch body-parser

目标:在fetch()函数中从 HTML 发送一些定义的字符串数据。 “我的数据”


我的代码:

HTML

<!DOCTYPE html>
<html>
<body>

<script type="text/javascript">
    function fetcher() {
      fetch('/compute',
        {
          method: "POST",
          body: "MY DATA",
          headers: {
            "Content-Type": "application/json"
          }
        }
      )
      .then(function(response) {
        return response.json();
      })
      .then(function(myJson) {
        console.log(myJson);
      });
    }
</script>

</body>
</html>

Server.js

var express = require("express");
var app     = express();
var compute = require("./compute");
var bodyParser = require("body-parser");

//not sure what "extended: false" is for
app.use(bodyParser.urlencoded({ extended: false }));

app.post('/compute', (req, res, next) => {
    console.log(req.body);
    var result = compute.myfunction(req.body);
    res.status(200).json(result);
});

当前console.log(req.body)日志{}

所需console.log(req.body)日志"MY DATA"

注释:

  1. 我还尝试在fetch()中以body: JSON.stringify({"Data": "MY DATA"})的形式发送正文,但得到相同的空{}
  2. 我的fetch()请求或bodyParser()设置不正确。

2 个答案:

答案 0 :(得分:4)

在当前的bodyParser app.use()之前添加以下行:

app.use(bodyParser.json());

这将使bodyParser能够解析application/json的内容类型。

希望有帮助!

答案 1 :(得分:0)

一旦我弄清bodyParser.urlencoded(来源:https://www.npmjs.com/package/body-parser#bodyparserurlencodedoptions)之后,我现在就感到有点愚蠢

  

返回仅解析经过加密的主体的中间件

解决方案

更改了fetch()的请求,来自:

body: "MY DATA",
headers: { "Content-Type": "application/json" }

body: JSON.stringify({"Data": "MY DATA"}),
headers: { "Content-Type": "application/x-www-form-urlencoded" }

解决了问题!控制台已记录:

  

{'{“数据”:“我的数据”}':''}