使用 bodyParser 和 Router() 无法检索表单输入答案

【问题标题】：Form inputs not retrievable using bodyParser and Router()使用 bodyParser 和 Router() 无法检索表单输入
【发布时间】：2018-10-03 00:47:16
【问题描述】：

我正在尝试创建一个注册表单，它将数据传递到注册路径。但是，我无法在注册路径中检索表单输入。请建议如何在 api.js 文件中检索表单数据。我尝试使用 POSTMAN 将数据发送到 /api/registration 端点，该端点确实在数据库中创建了一个用户。当我实际使用html表单注册时，它失败了。

HTML

<!DOCTYPE html>
<html>
<body>
    <form action="/api/register" enctype="multipart/form-data" method="post">
        <input name="email" type="text" placeholder="Email">
        <input name="password" type="password"  placeholder="Password">
        <input name="passwordConf" type="password"  placeholder="Confirm Password">
        <input type="submit" value="Register">
    </form>
</body>
</html>

Index.js

    //----setting up modules
const express = require('express');
const hbs = require('hbs');
const path = require('path');
var bodyParser = require('body-parser');
var mongoose = require('mongoose');
mongoose.Promise = global.Promise;
mongoose.connect(process.env.MONGODB_URI || 'mongodb://localhost/test');


//----define port connection on various environmentls
const port = process.env.PORT || 3000;

//----createing express app
var app = express();

// parse incoming requests
app.use(bodyParser.json());

//----use express middle-ware to utitlize public folder
// app.use(express.static(__dirname + 'public'));
app.use('/public', express.static(path.join(__dirname,'public')));
//see the first argument in above line it assigns which directory path is used to access the public file through URL


//----initializing handlebars as express view engine
app.set('view engine', 'hbs');

//----define handlebars partials and helpers 
hbs.registerPartials(__dirname + '/views/partials');
//----define helper to get current year
hbs.registerHelper('getDate', ()=>{
    return new Date().getFullYear();
});

//----define routes
app.get('/', function (req, res) {
    res.render('home.hbs')
})

// include routes
app.use('/api', require('./routes/api'));
app.use('/', require('./routes/page'));

//----connecting to port
app.listen(port,()=>{
    console.log(`success connection to port ${port}`);
})

Api.js 路由

var express = require('express');
var router = express.Router();
var {User} = require('./../models/user');
var {authenticate} = require('./../middleware/authenticate');
var _ = require('lodash');
var bodyParser = require('body-parser');
var jsonParser = bodyParser.json()
var urlencodedParser = bodyParser.urlencoded({ extended: false })


router.post('/register',function (req, res) {
    console.log(req.body);
    });
module.exports = router;

pages.js

    var express = require('express');
var router = express.Router();

router.get('/register', function (req, res) {
    res.render('register.hbs', {title:"REGISTER"} )
})

router.get('/login', function (req, res) {
    res.render('login.hbs', {title:"LOGIN"} )
})

module.exports = router;

【问题讨论】：

代码看起来应该可以工作。您没有实际进行注册的代码，只有 console.log，所以提交表单意味着它不会注册任何人
@apscience，不。我实际上有注册代码，但我已将其替换为 console.log(req.body);。我仍在试图弄清楚为什么它没有检索表单数据
我相信是因为你有 method="/api/register" 然后你把路由器称为 router.post('/register') 。他们不匹配
@AmirHosseinRd，我现在也将表单操作更改为“/api/register”，并将端点更改为“/api/register”。但是还是不行
我看到了app.use(bodyParser.json())，但没有看到app.use(bodyParser.urlencoded())。由于您没有发布 JSON，因此您需要默认的表单处理程序。另外，为什么你的表单是enctype"multipart/form-data"？您没有发布任何文件

标签： javascript html node.js express handlebars.js

【解决方案1】：

这是我的建议：

创建一个名为 routes.js 的文件，并在其中包含您的所有路线并导入它。

var express = require('express');
var router = express.Router();

app.get('/', function (req, res) {
    res.render('home.hbs')
})

router.get('/api/register', function (req, res) {
    res.render('register.hbs', {title:"REGISTER"} )
})

router.post('/api/register',function (req, res) {
    //do your post logic here
    console.log(req.body);
    });

router.get('/login', function (req, res) {
    res.render('login.hbs', {title:"LOGIN"} )
})

module.exports = router;

在您的 Index.js 中：

//Make sure the route is correct

app.use('/', require('/routes/routes.js'));

这样做，我希望错误得到解决，祝你好运！

【讨论】：

谢谢！如果我在 index.js 中包含 app.use(bodyParser.urlencoded()) 并从我的注册表单中删除 enctype，这实际上是有效的