javascript - Certain routes go to 404 error page express

Question

I am setting up my first node project. I had all the pages working nicely until I started to move some thing around. I have done all of my routing for different pages in index.js. I have changed that and created a login.js file within my rotes folder to break up some of the logic. Before, all urls were working and displaying pages correctly. Post refactoring, I keep getting 404 page not found errors for all of the login routes.

app.js:

var express = require('express');
var exphbs  = require('express-handlebars');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var session = require('express-session');
var passport = require('passport');
var bodyParser = require('body-parser');

var routes = require('./routes/index');
var login = require('./routes/login');
//Using firebase initialized in config file.
var database = require('./config/firebase');
var app = express();


///Setting stuff up here .....

app.use('/', routes);
app.use('/login', login);

app.use(function(req,res){
    res.status(404);
    res.render('404');
});

module.exports = app;

index.js:

var express = require('express');
var router = express.Router();
var csrf = require('csurf');
var csrfProtection = csrf();
var firebase = require('firebase');
var login = require('./login'); 


//tell express: All routes should be protected by csrf protection.
router.use(csrfProtection);

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('home', { title: 'Express' });
});

module.exports = router;

login.js:

var express = require('express');
var router = express.Router();
var csrf = require('csurf');
var csrfProtection = csrf();
//Using firebase initialized in config file.
var database = require('../config/firebase');

router.use(csrfProtection);

router.get('/login', function(req, res, next) {
  res.render('login', { title: 'Login' });
});

router.get('/forgotpassword', function (req,res){
    res.render('forgotpassword', {title:'Forgot Password'})
});

//ADD A TERMS PAGE TO SHOW TERMS AND CONDITIONS
router.get('/signup', function (req,res){
    res.render('signup', {title:'Sign up', csrfToken: req.csrfToken()});
});

router.post('/signup', function(req, res, next){
    res.redirect('/');
});

module.exports = router;

The index.js is rendering the home view properly. Rest of the routes, like /login, or /signup are all going to 404 and I can't seem to figure out why.

Answer 1

When you do this:

app.use('/login', login);

You're telling Express that all requests starting with /login should be passed to the "login" router.

In that router, any URL's that you want to handle should be relative to that /login prefix (this is also somewhat explained here).

In other words, if you want to add a handler for /login itself, you need to add this:

router.get('/', function(req, res, next) { ... });

This will also present an issue for you, because if I understand you correctly, you also want a handler for /signup, which you cannot create from a router that is already prefixed with /login. In your case, your router is creating a handler for /login/signup.

You're going to need a separate router to handle /signup, and attach it to the main app like this:

app.use('/signup', signup);