将post方法发送到服务器undefined - 错误

时间:2017-11-17 12:06:26

标签: node.js express pug

我的表单位于JADE,看起来像这样。

  form(action='/test/about', method='post')
          .form-group
            label(for='nameFormControlInput1') Name
            input#nameFormControlInput1.form-control(type='text', placeholder='name')
  .form-group
          input(type='submit', value='Add')

在我的app.js我的POST方法定义如下:

var express = require('express')
  , stylus = require('stylus')
  , nib = require('nib')


var app = express()

function compile(str, path) {
  return stylus(str)
    .set('filename', path)
    .use(nib());
}

app.set('views', __dirname + '/views')
app.set('view engine', 'jade')
app.use(express.logger('dev'))
app.use(stylus.middleware(
  { src: __dirname + '/public'
  , compile: compile
  }
))
app.use(express.static(__dirname + '/public'))

app.get('/', function (req, res) {
  res.render('index',
  { title : 'Home' }
  )
})

app.post('/test/about', function (req, res) {
  console.log(req.body);
  res.render('index',
  { title : 'Home' }
  )
})

app.listen(3000)

但是,我添加了console.log(req.body),它现在打印为undefined 我该如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

首先,您需要在输入元素中添加name属性并使用body-parser

    var express = require('express')
        , stylus = require('stylus')
        , nib = require('nib')
        , bodyParser = require('body-parser');

    var app = express()
    function compile(str, path) {
        return stylus(str)
            .set('filename', path)
            .use(nib());
    }

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

   app.set('views', __dirname + '/views')
   app.set('view engine', 'jade')
    // app.use(express.logger('dev'))
    app.use(stylus.middleware(
        {
            src: __dirname + '/public'
            , compile: compile
        }
    ))
    app.use(express.static(__dirname + '/public'))

    app.get('/', function (req, res) {
        res.render('index',
            { title: 'Home' }
        )
    })

    app.post('/test/about', function (req, res) {
        console.log(req.body);

        res.render('formresult',
            {
                title: 'Form Result',
                name: req.body.nameFormControlInput1
            }
        )
    })

    app.listen(3000)

发布数据后,您可以使用req.body.nameFormControlInput1

进行访问

我创建了另一个jade文件来显示发布的数据。

<强> formresult.jade

- if(name)
 h1=name
- else
 h1 No data

<强> index.jade

name="nameFormControlInput1"添加到输入字段

form(action='/test/about', method='post')
 .form-group
  label(for='nameFormControlInput1') Name
  input#nameFormControlInput1.form-control(type='text', placeholder='name', name="nameFormControlInput1")
  .form-group
   input(type='submit', value='Add')