繁体   English   中英

404 错误快速路由

[英]404 Error Express Routes

当我尝试从索引页面访问其他路由时遇到问题。 我可以点击索引没问题,但任何其他路线我都会收到 404 错误。 其他路线几乎相同,所以我不确定发生了什么。 知道我做错了什么吗? 谢谢。

这是我的 app.js:

var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');

var indexRouter = require('./routes/index');
var aboutRouter = require('./routes/about');
var workRouter = require('./routes/work');
var projectRouter = require('./routes/projects');
var donateRouter = require('/routes/donate');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', indexRouter);
app.use('/about', aboutRouter);
app.use('/work', workRouter);
app.use('/projects', projectRouter);
app.use('/donate', donateRouter);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

这是 index.js 路由:

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res) {
  res.render('index'){
    if(err){
      console.log(err);
    }
  };
});

module.exports = router;

这是新的 about.js 路由:

var express = require('express');
var router = express.Router();

/* GET about page. */
router.get('/about', function(req, res, next) {
  res.send('about page'){
    if(err){
      console.log(err);
    }
  };
});

module.exports = router;

我正在使用部分,所以这里是 header.ejs。

<!DOCTYPE html>
<html>
  <head>
    <title>Africa Foundation</title>
    <link rel='stylesheet' href='/stylesheets/bootstrap.min.css' />
    <link rel='stylesheet' href='/stylesheets/main.css' />
    <script src='/javascripts/fontawesome-all.min.js'></script>

  </head>
  <body>
    <nav class="navbar navbar-expand-lg navbar-light bg-light">
      <a class="navbar-brand" href="/">
        <img id='af-logo-nav' src='/images/swirl.png'>
        <span>Africa Foundation</span>
      </a>
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>

      <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav mr-auto">
          <li class="nav-item active">
            <a class="nav-link" href="/about">About <span class="sr-only">(current)</span></a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="/work">Our Work</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="/projects">Projects</a>
          </li>
          <li class="nav-item">
            <a class="nav-link btn-btn-warning" href="/donate">Donate</a>
          </li>

        </ul>
        <form class="form-inline my-2 my-lg-0">
          <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
          <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
        </form>
      </div>
    </nav>
    <div class="bg">

我相信使用您当前的代码,您需要点击的路线是 /about/about 才能使其工作。 检查这是否有效,是否有效。 将您的 app.use('about', aboutRouter) 更改为 app.use(aboutRouter)。 然后您的路线应该按预期工作。 这是因为在 app.use 中设置 'about' 会设置一种虚拟路由

而不是使用

res.send("关于页面")

你能把它改成简单的名字吗

“关于”

就像那样有时空间会带来麻烦。 我认为这可能奏效。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM