Node.js/Express - 路由多個表單發佈

Question

我正在使用兩個獨立表單操作的網頁上有兩個單獨的表單。我可以得到一份表格，但我無法同時工作。如果我改變了其中一個路由器（'/ other-user'，...）router.post（'/ direct-user'，...）和post path router.post（'/ other-user'，...）只是router.post（'/'，...），那麼它工作得很好。

我懷疑我的app.js路由聲明有問題，但我無法弄清楚。

任何指導將超級棒。

我的應用程序的結構是這樣的：

/project 
    /routes 
     index.js 
     requser.js 
    /views 
     error.hbs 
     index.hbs 
     layout.hbs 
     requser.hbs 
    app.js 
    package.json 

下面是其中有我的模塊導入，路線的地點和錯誤處理我的主要的應用程序文件。 app.js

// Module imports // 
var express = require('express'); 
var bodyParser = require('body-parser'); 
var cookieParser = require('cookie-parser'); 
var morgan = require('morgan'); 
var path = require('path'); 
var app = express(); 

app.set('views', path.join(__dirname, 'views')); 
app.set('view engine', 'hbs'); 
app.use(morgan('dev')); 
app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded({ extended: false })); 
app.use(validator()); 
app.use(express.static(path.join(__dirname, 'public'))); 


// Routes and views // 
app.use('/', require('./routes/index')); 
app.use('/user/:id', require('./routes/user')); 
app.use('/user-update', require('./routes/user')); 
app.use('/requser', require('./routes/requser')); 
app.use('/direct-user', require('./routes/requser')); 
app.use('/other-user', require('./routes/requser')); 


// Catch 404 and forward to error handler // 
app.use(function(req, res, next) { 
     var err = new Error('Not Found'); 
     err.status = 404; 
     next(err); 
}); 

// Development error handler; will print stacktrace // 
if (app.get('env') === 'development') { 
     app.use(function(err, req, res, next) { 
       res.status(err.status || 500); 
       res.render('error', { 
         message: err.message, 
         error: err 
       }); 
     }); 
} 

// Production error handler; no stacktraces leaked to user // 
app.use(function(err, req, res, next) { 
     res.status(err.status || 500); 
     res.render('error', { 
       message: err.message, 
       error: {} 
     }); 
}); 

module.exports = app; 

這是我requser文件，其中包括一個獲得途徑來加載空的形式，和兩個郵路從兩種形式的一個處理輸入。 requser.js

// Module imports // 
var express = require('express'); 
var router = express.Router(); 


// GET request user form // 
router.get('/', function(req, res, next) { 
    res.render('requser', { 
     title: 'User Request' 
    }); 
}); 


// POST /direct-user // 
router.post('/direct-user', function(req, res) { 
    // Validate form contents 
    // ... 

    // Assuming all is well 
    console.log('Direct user requested'); 
    res.send('cool'); 
}); 

// POST other-user // 
router.post('/other-user', function(req, res) { 
    // Validate form contents 
    // ... 

    // Assuming all is well 
    console.log('Other user requested'); 
    res.send('cool'); 
}); 

module.exports = router; 

最後，我的表單視圖/模板。 requser.hbs

<div class="container"> 
<h1>User Request</h1> 

<!-- Start of direct user creation form //////////////////////////////// --> 
<form method="post" action="/direct-user"> 
    <!-- First name, last name --> 
    <!-- ... --> 

    <!-- Submit button --> 
    <div class="row"> 
     <div class="col-md-11"> 
      <div class="form-group"> 
       <button type="submit" class="btn btn-custom">Submit</button> 
      </div> 
     </div> 
    </div> <!-- End row --> 
</form> <!-- End form --> 


<!-- Start of other user creation form //////////////////////////////// --> 
<form method="post" action="/other-user"> 
    <!-- First name, last name --> 
    <!-- ... --> 

    <!-- Submit button --> 
    <div class="row"> 
     <div class="col-md-11"> 
      <div class="form-group"> 
       <button type="submit" class="btn btn-custom">Submit</button> 
      </div> 
     </div> 
    </div> 
</div> <!-- End container --> 

Answer 1

您正在使用不正確的方式路由中間件。

app.use('/user/:id', require('./routes/user')); 
app.use('/user-update', require('./routes/user')); 
app.use('/requser', require('./routes/requser')); 
app.use('/direct-user', require('./routes/requser')); 
app.use('/other-user', require('./routes/requser')); 

這些行是有問題的。

讓我們以其中一個爲例，第三個例子，因爲它本身足以處理/direct-user和/other-user端點。

這也就行告訴快遞做的是：

當請求達到其路徑與/ requser啓動服務器，傳遞請求requser路由器中間件，它會處理其餘部分。

假設您的要求是路徑/requser/direct-user。該請求將傳遞給requser中間件，該中間件將與剩餘部分（/direct-user）匹配並正確調用相關回調。

不知道你的表單在哪裏發佈數據，我無法幫助你進一步。但是你應該檢查這兩個表單分別發佈他們的數據到/requser/direct-user和/requser/other-user，它應該工作。

Answer 2

app.use('/user/:id', require('./routes/user')); 

所有代碼的那些行告訴您的應用程序使用使用該文件導出的路線「/用戶/：身份證」作爲前綴。因此，如果您想使用該文件中的所有路由，現在所有路由都以'/ users /：id'+您在文件中創建的路由開始。

比方說，你有以下途徑

router.post('/direct-user', function(req, res) { 
    // Validate form contents 
    // ... 

    // Assuming all is well 
    console.log('Direct user requested'); 
    res.send('cool'); 
}); 

那麼你的路線將是'/用戶/：ID /直接用戶