Express.js POST 方法不起作用

Question

我正在嘗試創建一個基於討論的 Node.js/Express-app，我正在頁面上創建一個討論。 我只是在測試我的討論控制器文件是否已鏈接，但是每次我單擊按鈕發布表單時，它都沒有做任何事情。

我的哈巴狗（視圖），名為“createDisc.pug”

extends layout
block content
    h1 Create new discussion
    form(action='', method='post')
    div
        label(for='title') Title
        input#title
    div
        label(for='desc') Description
        input#desc
    div
        input(type='submit', value='Create')

我的路由器，名為“createDisc.js”

var express = require('express');
var router = express.Router();
var disc = require('../controllers/disc');

router.get('/discussion/create', function (req, res, next) {
    res.render('createDisc');
});

router.post('/discussion/create', disc.createDisc);

module.exports = router;

我的控制器名為“disc.js”，我只是想將“測試”發送到我的控制台

exports.createDisc = function (req, res, next) {
    console.log('test');
};

我的 app.js 文件

const express = require('express');
const bodyParser = require('body-parser');
const mongoose = require('mongoose');
const passport = require('passport');
const path = require('path');
const cookieParser = require('cookie-parser');
const session = require('express-session');

const app = express();

const db = require('./controllers/db');

require('./config/passport')(passport);

mongoose.connect(db.url);

app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

app.use(bodyParser.json());
app.use(express.static(path.join(__dirname, 'public')));
app.use(bodyParser.urlencoded({extended: true}));
app.use(cookieParser());
app.use('/', require('./routes/createDisc'));

app.listen(3000, function() {
    console.log('Example listening on port 3000!')
})

Answer 1

您提到/discussion/create作為您的GET路由並將其鏈接到 express 路由器，例如：

 router.get('/discussion/create', function (req, res, next) { res.render('createDisc'); }); router.route('/discussion/create', disc.createDisc);

因此，實際上，您正在啟用以下路線：

GET /discussion/create/discussion/create

請嘗試使用.post()鈎子並像這樣使用它：

router.post('/', function (req, res, next) {
    res.render('createDisc');
});

router.route('/discussion', disc.createDisc);

參考： http : //expressjs.com/en/guide/routing.html

提示：請參閱此鏈接以制作更有意義的路線。 https://github.com/squareboat/api-guidelines#http-methods

更新 #1

目前，在您的 HTML(pug) 表單中，您有action='' ，這意味着您的表單正在向POST /發出請求。

請將操作值更改為action='/discussion/create'並重試。

更新 #2

我已經對您的代碼進行了精簡版本（沒有視圖或數據庫），並且運行良好。 你可以在這里看到代碼。

測試路線如下：

GET http://localhost:3000/discussion/create

POST http://localhost:3000/discussion/create

更新 #3

在您的 pug 文件中，您的縮進是錯誤的，因為輸入字段未包含在表單標簽內。 你有一個空表格。

extends layout
block content
    h1 Create new discussion
        form(action='/discussion/create', method='post')
            div
                label(for='title') Title
                input#title
            div
                label(for='desc') Description
                input#desc
            div
                input(type='submit', value='Create')

這將起作用。

Answer 2

嘗試將表單修改為如下所示：

form(method='post', action='./create') 

看看它是否有效