如何处理get/post在Express 4/nodejs从app.js传递数据从表单到新页面显示结果

How to handle get/post in Express 4/nodejs from app.js passing data from form to new page displaying results

本文关键字：js app 表单 结果 显示 新页面 数据 处理 何处理 get Express      更新时间：2023-09-26

我相信这是一个非常简单的问题，但我想我现在有一个心理障碍来回答它。

我已经安装了node.js和express 4，我可以运行静态页面没有任何问题。我想做的是创建一个表单来捕获一些数据，然后在结果页面中显示我在表单中捕获的数据。我使用Jade来处理HTML部分。

在app.js文件中，我只更改了这些内容:

. 

var routes = require('./routes/index');
var users = require('./routes/users');
// new routes
var helloworld = require('./routes/helloworld');
var sampleform = require('./routes/sampleform');

…

app.use('/', routes);
app.use('/users', users);
// new pages
app.get('/helloworld', helloworld);
app.get('/sampleform', sampleform);

我有一个简单的示例表单。玉文件:

html
    head
        title Sample Form
    body
        h2 Sample Form
        form(name='sampleform' action='/sampleform' method='post')
            table(border='0')
                tr
                    td Name
                    td 
                        input(name='name' type='text' size='30')
                tr
                    td Email
                    td
                        input(name='email' type='text' size='30')
                tr
                    td
                        input(type='submit', name='submit', value='Submit')

我可以使用下面的sampleform.js加载表单，没有问题:

var express = require('express');
var router = express.Router();
/* GET sample form page. */
router.get('/sampleform', function(req, res) {
    res.render('sampleform');
});
router.post('/showresults', function(req, res) {
    res.render('showresults')
});
module.exports = router;

showresults。jade目前只有静态内容(我没有showresults .js，因为这个页面只从sampleform.js调用):

html
    head
        title Show Results
    body
        h2 Show Results

我需要的是按钮提交后，在sampleform中单击名为showresults的新页面显示(它最终将有来自sampleform的数据，但我现在需要的是加载该页面)。上面sampleform.js中的代码产生404错误，我知道它不起作用。我能做什么呢?我错过了什么在app.js代码?

提前感谢您的帮助!

从我所看到的，您在Jade文件中将表单提交到GET路由，而不是POST路由，在这里:

form(name='sampleform' action='/sampleform' method='post')

因此，不是将表单提交发送到GET请求，而是需要将其发送到POST。您在这里声明了POST路由:

router.post('/showresults', function(req, res) {

因此，您应该只将Jade文件中的表单中的action更改为指向/showresults，因为它是POST路由而不是GET /sampleform。然后，您只需要调用req.body来检索之前提交的整个表单。

相关文章：