关于node.js：如何将404错误重定向到ExpressJS中的页面？


How to redirect 404 errors to a page in ExpressJS?

我不知道这样做的功能，有人知道吗？

我发现这个例子非常有帮助：

https://github.com/visionmedia/express/blob/master/examples/error-pages/index.js

所以它实际上就是这个部分：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
//"app.router" positions our routes
// above the middleware defined below,
// this means that Express will attempt
// to match & call routes _before_ continuing
// on, at which point we assume it's a 404 because
// no route has handled the request.

app.use(app.router);

// Since this is the last non-error-handling
// middleware use()d, we assume 404, as nothing else
// responded.

// $ curl http://localhost:3000/notfound
// $ curl http://localhost:3000/notfound -H"Accept: application/json"
// $ curl http://localhost:3000/notfound -H"Accept: text/plain"

app.use(function(req, res, next){
  res.status(404);

  // respond with html page
  if (req.accepts('html')) {
    res.render('404', { url: req.url });
    return;
  }

  // respond with json
  if (req.accepts('json')) {
    res.send({ error: 'Not found' });
    return;
  }

  // default to plain-text. send()
  res.type('txt').send('Not found');
});
相关讨论

我认为您应首先定义所有路线，并作为最后一条路线添加

1
2
3
4
//The 404 Route (ALWAYS Keep this as the last route)
app.get('*', function(req, res){
  res.status(404).send('what???');
});

一个有效的示例应用程序：

app.js：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var express = require('express'),
    app = express.createServer();

app.use(express.static(__dirname + '/public'));

app.get('/', function(req, res){
  res.send('hello world');
});

//The 404 Route (ALWAYS Keep this as the last route)
app.get('*', function(req, res){
  res.send('what???', 404);
});

app.listen(3000, '127.0.0.1');
1
2
3
4
5
6
7
8
9
10
11
12
13
14
alfred@alfred-laptop:~/node/stackoverflow/6528876$ mkdir public
alfred@alfred-laptop:~/node/stackoverflow/6528876$ find .
alfred@alfred-laptop:~/node/stackoverflow/6528876$ echo"I don't find a function for that... Anyone knows?"> public/README.txt
alfred@alfred-laptop:~/node/stackoverflow/6528876$ cat public/README.txt

.
./app.js
./public
./public/README.txt

alfred@alfred-laptop:~/node/stackoverflow/6528876$ curl http://localhost:3000/
hello world
alfred@alfred-laptop:~/node/stackoverflow/6528876$ curl http://localhost:3000/README.txt
I don't find a function for that... Anyone knows?
相关讨论

您可以将中间件放在抛出NotFound错误的最后位置，
甚至直接渲染404页面：

1
2
3
app.use(function(req,res){
    res.status(404).render('404.jade');
});
相关讨论

上面的答案是好的，但是其中一半你不会得到404作为你的HTTP状态代码返回，而在另一半，你将无法有自定义模板渲染。在Expressjs中拥有自定义错误页面(404)的最佳方法是

1
2
3
app.use(function(req, res, next){
    res.status(404).render('404_error_template', {title:"Sorry, page not found"});
});

将此代码放在所有URL映射的末尾。

相关讨论

在app.js的最后一行只是放了这个函数。这将覆盖默认的page-not-found错误页面：

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

它将覆盖所有没有有效处理程序的请求并呈现您自己的错误页面。

相关讨论

你的问题的答案是：

1
2
3
app.use(function(req, res) {
    res.status(404).end('error');
});

有一篇很棒的文章说明为什么它是最好的方式。

相关讨论

在某些情况下，404页面无法写入以作为最后一个路由执行，特别是如果您有一个异步路由功能导致一个/路由延迟到该方。在这些情况下可能采用以下模式。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
var express = require("express.io"),
    app = express(),
    router = express.Router();

router.get("/hello", function (req, res) {
    res.send("Hello World");
});

// Router is up here.
app.use(router);

app.use(function(req, res) {
    res.send("Crime Scene 404. Do not repeat");
});

router.get("/late", function (req, res) {
    res.send("Its OK to come late");
});

app.listen(8080, function (){
    console.log("Ready");
});
相关讨论

https://github.com/robrighter/node-boilerplate/blob/master/templates/app/server.js

这就是node-boilerplate的作用。

express-error-handler允许您为错误指定自定义模板，静态页面或错误处理程序。它还执行每个应用程序应该实现的其他有用的错误处理事项，例如防止4xx错误DOS攻击，以及对不可恢复的错误的正常关闭。这是你如何做你要求的：

1
2
3
4
5
6
7
8
9
10
11
12
13
var errorHandler = require('express-error-handler'),
  handler = errorHandler({
    static: {
      '404': 'path/to/static/404.html'
    }
  });

// After all your routes...
// Pass a 404 into next(err)
app.use( errorHandler.httpError(404) );

// Handle all unhandled errors:
app.use( handler );

或者对于自定义处理程序：

1
2
3
4
5
6
7
handler = errorHandler({
  handlers: {
    '404': function err404() {
      // do some custom thing here...
    }
  }
});

或者对于自定义视图：

1
2
3
4
5
handler = errorHandler({
  views: {
    '404': '404.jade'
  }
});
1
2
3
4
5
6
7
8
9
10
11
// Add this middleware
// 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');
  });

最简单的方法是对Error Page进行全部捕获

1
2
3
// Step 1: calling express
const express = require("express");
const app = express();

然后

1
2
// require Path to get file locations
const path = require("path");

现在，您可以将所有"html"页面(包括错误"html"页面)存储在变量中

1
2
3
4
5
// Storing file locations in a variable
var indexPg = path.join(__dirname,"./htmlPages/index.html");
var aboutPg = path.join(__dirname,"./htmlPages/about.html");
var contactPg = path.join(__dirname,"./htmlPages/contact.html");
var errorPg = path.join(__dirname,"./htmlPages/404.html"); //this is your error page

现在，您只需使用Get方法调用页面，并使用app.get("*")对所有无法指向错误页面的路径进行全部捕获

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
//Step 2: Defining Routes
//default page will be your index.html
app.get("/", function(req,res){
  res.sendFile(indexPg);
});
//about page
app.get("/about", function(req,res){
  res.sendFile(aboutPg);
});
//contact page
app.get("/contact", function(req,res){
  res.sendFile(contactPg);
});
//catch all endpoint will be Error Page
app.get("*", function(req,res){
  res.sendFile(errorPg);
});

不要忘记设置端口和侦听服务器：

1
2
3
4
5
6
// Setting port to listen on
const port = process.env.PORT || 8000;
// Listening on port
app.listen(port, function(){
  console.log(`http://localhost:${port}`);
})

现在应该显示所有无法识别的端点的错误页面！

嗨，请找到答案

1
2
3
4
5
6
7
8
9
10
const express = require('express');
const app = express();
const port = 8080;

app.get('/', (req, res) => res.send('Hello home!'));
app.get('/about-us', (req, res) => res.send('Hello about us!'));
app.post('/user/set-profile', (req, res) => res.send('Hello profile!'));
//last 404 page
app.get('*', (req, res) => res.send('Page Not found 404'));
app.listen(port, () => console.log(`Example app listening on port ${port}!`));

虽然上面的答案是正确的，但对于那些想要在IISNODE中工作的人，您还需要指定

1
2
3
4
5
<configuration>
    <system.webServer>
        <httpErrors existingResponse="PassThrough"/>
    </system.webServer>
<configuration>

在你的web.config中(否则IIS会占用你的输出)。

相关讨论

你可以根据内容类型进行错误处理

另外，根据状态代码进行处理。

app.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
import express from 'express';

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

// when status is 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);
    if( 404 === err.status  ){
        res.format({
            'text/plain': () => {
                res.send({message: 'not found Data'});
            },
            'text/html': () => {
                res.render('404.jade');
            },
            'application/json': () => {
                res.send({message: 'not found Data'});
            },
            'default': () => {
                res.status(406).send('Not Acceptable');
            }
        })
    }

    // when status is 500, error handler
    if(500 === err.status) {
        return res.send({message: 'error occur'});
    }
});

404.jade

1
2
3
4
5
6
7
8
9
10
11
12
doctype html

html
  head
    title 404 Not Found

    meta(http-equiv="Content-Type" content="text/html; charset=utf-8")
    meta(name ="viewport" content="width=device-width, initial-scale=1.0 user-scalable=no")

  body
      h2 Not Found Page
      h2 404 Error Code

如果可以使用res.format，则可以编写简单的错误处理代码。

建议res.format()而不是res.accepts()。

如果前一代码中发生500错误，则调用if(500 == err.status){. . . }

要发送到自定义页面：

1
2
3
4
5
6
app.get('*', function(req, res){
  if (req.accepts('html')) {
     res.send('404', 'location.href="/the-404-page.html";');
     return;
  }
});
相关讨论

我使用下面的处理程序处理404错误与静态.ejs文件。

将此代码放在路由脚本中，然后在app.js / server.js / www.js中要求file.js到app.use()(如果使用IntelliJ for NodeJS)

您还可以使用静态.html文件。

1
2
3
4
5
6
//Unknown route handler
 router.get("[otherRoute]", function(request, response) {
     response.status(404);
     response.render("error404.[ejs]/[html]");
     response.end();
 });

这样，正在运行的快速服务器将使用正确的404 error进行响应，并且您的网站还可以包含正确显示服务器404响应的页面。您还可以在404 error template中加入navbar，链接到您网站的其他重要内容。

如果要从功能(路线)重定向到错误页面，请执行以下操作 -

  • 在app.js中添加常规错误消息代码 -

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    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
        // you can also serve different error pages
        // for example sake, I am just responding with simple error messages
        res.status(err.status || 500)
       if(err.status === 403){
           return res.send('Action forbidden!');
       }

       if(err.status === 404){
           return res.send('Page not found!');
       }

       // when status is 500, error handler
       if(err.status === 500) {
           return res.send('Server error occured!');
       }
       res.render('error')
    })

  • 在您的函数中，您可以先使用设置错误状态，然后使用next()代码流来查看错误页面重定向，而不是使用错误页面重定向 -

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    if(FOUND){
        ...
    }else{
        // redirecting to general error page
        // any error code can be used (provided you have handled its error response)
        res.status(404)
        // calling next() will make the control to go call the step 1. error code
        // it will return the error response according to the error code given (provided you have handled its error response)
        next()
    }

    • 如果您使用快速生成器包：

    下一个(ERR);

    此代码将您发送到404中间件。

    1
    2
    3
    app.get('*',function(req,res){
     res.redirect('/login');
    });