Node.js express：试图从 HTML 表单中获取文本，req.body 为空

Question

我正在尝试构建一个基本的文本到语音表单，但我无法从表单中获取文本。 我正在尝试使用快速服务器从 HTML 表单中获取文本，并且 req.body 每次都变为空。 我尝试使用 body-parser 并更改表单上的 enctype，但似乎没有任何效果。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>index.html</title>
  </head>
  <body>

    <h1>Speech!!</h1>
    <main>
        <form action="/speak" method="POST" id="speak-form" enctype="multipart/form-data">
            <div id="text-container">
                <label for="text-box">Text to Speech!</label>
                <input type="text" id="text-box" title="text" placeholder="Type what you want to say here!"/>
            </div>
            <div class="button-container">
                <button type="submit" id="submit-button">Speak!</button>
            </div>
            <div class="button-container">
                <button type="reset" id="clear-form">Clear Text</button>
            </div>
        </form>
    </main>
  </body>
</html>

应用程序.js

    const express = require("express");
    const bodyParser = require('body-parser');
    const app = express();
    const configRoutes = require("./routes");

    app.use(bodyParser.json()); 
    app.use(bodyParser.urlencoded({ extended: true })); 

    configRoutes(app);

    app.listen(3000, () => {
      console.log("Speech Server");
    });

index.js

const express = require("express");
const speakRoutes = require("./speak");

const constructorMethod = (app) => {
    app.use("/speak",speakRoutes);

    app.use("*", (req,res) => {
        res.sendFile("index.html", { root: "./public" });
    });
};

module.exports = constructorMethod;

说话.js

const express = require("express");
const router = express.Router();

router.post("/", async (req,res) => {
    console.log("POST");
    console.log(req.body);
    res.sendFile("index.html", { root: "./public" });
});

module.exports = router;

我将不胜感激一些帮助！ 谢谢！

Answer 1

您的输入没有名称，请为您的输入命名，以便您知道要在表单中查找的属性：

<input type="text" id="text-box" name="whatever" ... />

编辑：仅限客户端的示例。 一个字段有一个名称。

 $('form').on('submit', function(e) { e.preventDefault(); console.log($(e.currentTarget).serialize()); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <h1>Speech!!</h1> <main> <form action="/speak" method="POST" id="speak-form" enctype="multipart/form-data"> <div id="text-container"> <label for="text-box">Text to Speech!</label> <input type="text" id="text-box" title="text" placeholder="Type what you want to say here!" name="whatever" /> <input type="text" id="text-box" title="text" placeholder="I have no name so I won't be sent!" /> </div> <div class="button-container"> <button type="submit" id="submit-button">Speak!</button> </div> <div class="button-container"> <button type="reset" id="clear-form">Clear Text</button> </div> </form> </main>

Answer 2

我解决了我自己的问题！ 它通过更改post get路线和 html 表单方法和req.body到req.query来工作

Node.js express：试图从 HTML 表单中获取文本，req.body 为空

问题描述

2 个解决方案

解决方案1
0 2020-06-02 02:47:15

解决方案2
0 2020-06-02 04:38:38

Node.js express：试图从 HTML 表单中获取文本，req.body 为空

问题描述

2 个解决方案

解决方案1 0 2020-06-02 02:47:15

解决方案2 0 2020-06-02 04:38:38

解决方案1
0 2020-06-02 02:47:15

解决方案2
0 2020-06-02 04:38:38