Question

我在NodeJS / ExpressJS应用程序中有一个超级简单的表单，无法发布。

app.js代码（我称之为server.js）看起来像这样。

var express = require('express');
var fs = require('fs');
var path = require('path');
var urlEncoded = require('urlencoded-request-parser');

var bodyParser = require('body-parser');

var server = express();
var port = process.env.port || 1337;

server.use(urlEncoded());
server.use(bodyParser.urlencoded({extended: true}));

var routePath="./routes/"; 
fs.readdirSync(routePath).forEach(function(file) {
    var route=routePath+file;
    require(route)(server);
});

server.set('view engine', 'ejs');
server.set('views', __dirname);
server.listen(port);

我的帖子表格（post.ejs）

<form method="post" action="post-put"> 
    <fieldset>

        <!-- Form Name -->
        <legend>Which Test Type</legend>

        <!-- Multiple Radios (inline) -->
        <div class="form-group">
            <label class="col-md-2 control-label" for="TestType">Please test our</label>
            <div class="col-md-4"> 
                <label class="radio-inline" for="TestType-0">
                    <input type="radio" name="SoftwareTestType" id="TestType-0" value="SoftwareTest" checked="checked">
                    Software
                </label> 
                <label class="radio-inline" for="TestType-1">
                    <input type="radio" name="HardwareTestType" id="TestType-1" value="HardwareTest">
                    Hardware
                </label>
            </div>
        </div>
    </fieldset>
    <input type='submit' class="btn btn-default" id='submit' value='Submit your Test'/>
</form>

结果显示在此页面中（post-results.ejs）

<%= Test %>

我有两条路线（post-get.js）

module.exports = function(server){

    server.get('/post', function(req,res){
        res.render('./views/test/post.ejs',{            
        });
    });
}

和（post-puts.js）

module.exports = function(server){
    server.post('post-put', function(req,res){
        console.log("In Submission POST")
        var TestType = "";
        if(req.body.HardwareTestType == true) 
            TestType = "Hardware";
        else
            TestType = "Software";

        res.render('./views/test/post-results.ejs',{
            Test: TestType
        });
    });
}

当我点击提交按钮时，开发者工具显示： Network output of developer tools

这让我疯了。有谁知道如何将结果发布到post-results.ejs文件。应用程序的文件系统布局如下所示：

Project Layout

更新表单和路由器都有相同的路径＆＃34; post-puts＆＃34;。在post-puts路由中有一个console.log（）...但它没有被调用。我认为它仍然可以是图像中显示的应用程序类型两个（开发人员工具）什么时候＆＃34;＆＃34;只有一个功能，说它不起作用是具体的 - 如果我可以更具体，我会知道问题是什么并修复它。

Answer 1

此HTML网址路径<form method="post" action="/post-put">与代码server.post('/test/post-put'中的此路径不匹配。让它们匹配，它会起作用。

Answer 2

从帖子后删除斜杠

<form method="post" action="post-put">

Answer 3

<强>解决

以上问题的解决方案如下：

1）我将路线改回＆＃34; / post-put＆＃34;在Action和Route文件中。 2）我添加了enctype =＆＃34; multipart / form-data＆＃34;形式。

所以表单现在看起来像

<form method="post" action="/post-put" enctype="multipart/form-data"> 
    <fieldset>

        <!-- Form Name -->
        <legend>Which Test Type</legend>

        <!-- Multiple Radios (inline) -->
        <div class="form-group">
            <label class="col-md-2 control-label" for="TestType">Please test our</label>
            <div class="col-md-4"> 
                <label class="radio-inline" for="TestType-0">
                    <input type="radio" name="TestType" id="TestType-0" value="SoftwareTest" checked="checked">
                    Software
                </label> 
                <label class="radio-inline" for="TestType-1">
                    <input type="radio" name="TestType" id="TestType-1" value="HardwareTest">
                    Hardware
                </label>
            </div>
        </div>
    </fieldset>
    <input type='submit' class="btn btn-default" id='submit' value='Submit your Test'/>
</form>

替代解决方案 将表单输入保持为enctype="application/x-www-form-urlencoded" 在App.js（我的server.js）删除app.use(bodyparser.urlencoded()); 将app.use(bodyParser.urlencoded({extended: true}));更改为server.use(bodyParser.urlencoded());

现在表单的POST方法有效！感谢那些试图提供帮助的人。

Nodejs非常简单Form with Routes无法发布

3 个答案: