Question

我有一个基本的快递设置。我正在尝试做一些在教程上看起来很简单但对我来说根本不起作用的东西。我试图在两个输入中捕获用户输入的数据，文本输入和下拉输入。

我的app.js文件如下所示：

var express = require('express');
var bodyParser = require('body-parser');
var path = require('path');
var pug = require('pug');

// initialize express
var app = express();

// set up port
var port = process.env.PORT || 1337;

// setting up bodyParser middleware
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true}));

// setting up views
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');
app.use(express.static(path.join(__dirname, 'public')));

// initial homepage get
app.get('/', function(req, res) {
    res.render('index');
});

app.post('/', function(req, res) {
    var input = req.body.userInput;
    var quantity = req.body.quantity;

    console.log("input is: " + input);
    console.log("quantity is: " + quantity);
});

// listening on port
app.listen(port, function(err) {
    if (err) throw err;
    console.log("Server is running on port " + port);
});

我的哈巴狗文件表格如下：

.card
   .card-body
     form(action='/', method="POST")
       .form-row
          input.form-control(type='text', placeholder="Search for an item by its id", name="userInput")
       .form-row.mt-2
          .form-group
             select.form-control(name="quantity")
                option(value='1') Qty: 1
                option(value='2') Qty: 2
                option(value='3') Qty: 3
                option(value='4') Qty: 4
                option(value='5') Qty: 5
   .card-footer
        button.btn.btn-outline-secondary(type='submit')
           i.fas.fa-shopping-cart.mr-2
           | Add to my cart

一切都正常呈现。我为每个表单输入提供了一个“名称”字段，我尝试从app.js文件中的req.body。（name）中获取该数据。但是当我运行它并输入数据时，控制台日志中没有任何内容。

Answer 1

问题不在body-parser中，而在于HTML中。如果从开发人员控制台进行检查，则在单击按钮时看不到正在执行的请求，这是因为该按钮不在表单内部，因此不执行任何操作。

取出.card-footer以使表单中有按钮，您将收到带参数的请求。请求将挂起，因为post处理程序不返回任何内容，但您将在控制台中看到该参数。

Node / Express BodyParser不从输入字段返回数据或返回“未定义”

1 个答案: