我应该在Express和EJS中使用res.render还是res.redirect？

Question

我对这个话题很陌生。我想了解更多有关何时使用渲染和重定向的信息。目标是在用户单击按钮或登录后将其引导到另一个页面。此新页面需要数据，因此我在render命令期间传递此数据。除页面URL不能代表他们当前正在查看的正确页面外，此方法工作正常。在这种情况下，我想知道是否应该进行重定向。下面是我的代码。 这是我的server.js页面的代码片段

    // route for user Login
app.route('/login')
    .get(sessionChecker, (req, res) => {
        res.render('login');
    })
    .post((req, res) => {
        var username = req.body.username,
            password = req.body.password;

        User.findOne({ where: { username: username } }).then(function (user) {
            if (!user) {
                res.render('login');;
            } else if (!user.validPassword(password)) {
                res.render('login');;
            } else {
                req.session.user = user.dataValues;
                res.render('dashboard',{
                    "token" :  createToken(req),
                    "user" : req.session.user
                 });
            }
        });
    });

这是我的.ejs页面中的一小段代码

<% if( typeof user !== "undefined") { %>

                    <li><a href="/dashboard">Dashboard</a></li>
                    <li><a href="/reports">My Reports</a></li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">Action</a></li>
                            <li><a href="#">Another action</a></li>
                            <li><a href="#">Something else here</a></li>
                            <li role="separator" class="divider"></li>
                            <li><a href="#">Separated link</a></li>
                            <li role="separator" class="divider"></li>
                            <li><a href="#">One more separated link</a></li>
                        </ul>
                    </li>

                    <% } %>

这是我server.js页面中的完整代码。

var express = require('express');
var bodyParser = require('body-parser');
var cookieParser = require('cookie-parser');
var session = require('express-session');
var morgan = require('morgan');
var User = require('./models/user');
var crypto = require('crypto');

// invoke an instance of express application.
var app = express();

// set our application port
app.set('port', 9000);

app.set('view engine', 'ejs');
app.set('views', 'views');

// set morgan to log info about our requests for development use.
app.use(morgan('dev'));

// initialize body-parser to parse incoming parameters requests to req.body
app.use(bodyParser.urlencoded({ extended: true }));

// initialize cookie-parser to allow us access the cookies stored in the browser. 
app.use(cookieParser());

// initialize express-session to allow us track the logged-in user across sessions.
app.use(session({
    key: 'user_sid',
    secret: 'somerandonstuffs',
    resave: false,
    saveUninitialized: false,
    cookie: {
        expires: 600000
    }
}));


// This middleware will check if user's cookie is still saved in browser and user is not set, then automatically log the user out.
// This usually happens when you stop your express server after login, your cookie still remains saved in the browser.
app.use((req, res, next) => {
    if (req.cookies.user_sid && !req.session.user) {
        res.clearCookie('user_sid');        
    }
    next();
});


// middleware function to check for logged-in users
var sessionChecker = (req, res, next) => {
    if (req.session.user && req.cookies.user_sid) {
        res.render(req.originalUrl.substr(1, req.originalUrl.length),{
            "token" :  createToken(req),
            "user" : req.session.user
         });
    } else {
        next();
    }    
};

// route for Home-Page
app.get('/', sessionChecker, (req, res) => {
    res.redirect('/login');
});


// route for user signup
app.route('/signup')
    .get(sessionChecker, (req, res) => {
        //res.sendFile(__dirname + '/public/signup.html');
        res.render('signup');
    })
    .post((req, res) => {
        User.create({
            username: req.body.username,
            email: req.body.email,
            password: req.body.password,
            roles: req.body.roles
        })
        .then(user => {
            req.session.user = user.dataValues;
            res.render('dashboard',{
                "token" :  createToken(req),
                "user" : req.session.user
             });
        })
        .catch(error => {
            res.render('signup');
        });
    });


// route for user Login
app.route('/login')
    .get(sessionChecker, (req, res) => {
        res.render('login');
    })
    .post((req, res) => {
        var username = req.body.username,
            password = req.body.password;

        User.findOne({ where: { username: username } }).then(function (user) {
            if (!user) {
                res.redirect('/login');;
            } else if (!user.validPassword(password)) {
                res.redirect('/login');;
            } else {
                req.session.user = user.dataValues;
                res.render('dashboard',{
                    "token" :  createToken(req),
                    "user" : req.session.user
                 });
            }
        });
    });


// route for user's dashboard
app.get('/dashboard', (req, res) => {
    if (req.session.user && req.cookies.user_sid) {

        res.render('dashboard',{
           "token" : createToken(req),
           "user" : req.session.user
        });
    } else {
        res.render('login');
    }
});

// route for user's reports
app.get('/reports', (req, res) => {
    if (req.session.user && req.cookies.user_sid) {

        res.render('reports',{
           "token" : createToken(req),
           "user" : req.session.user
        });
    } else {
        res.render('login');
    }
});

// route for user's profile
app.route('/user_profile')
.get(sessionChecker, (req, res) => {
    res.render('user_profile');
})
.post((req, res) => {
    var username = req.body.username,
        password = req.body.password;

    User.findOne({ where: { username: username } }).then(function (user) {
        if (!user) {
            res.render('login');;
        } else if (!user.validPassword(password)) {
            res.render('login');;
        } else {
            req.session.user = user.dataValues;
            res.render('dashboard',{
                "token" :  createToken(req),
                "user" : req.session.user
             });
        }
    });
});

// route for user logout
app.get('/logout', (req, res) => {
    if (req.session.user && req.cookies.user_sid) {
        res.clearCookie('user_sid');
        res.render('login');;
    } else {
        res.render('login');;
    }
});




// route for handling 404 requests(unavailable routes)
app.use(function (req, res, next) {
  res.status(404).send("Sorry can't find that!")
});


// start the express server
app.listen(app.get('port'), () => console.log(`App started on port ${app.get('port')}`));

function createToken(req){
    var data = 'u=' + req.session.user.username + "|o=organization_1";  

    if (req.session.user.roles.length > 0){
        data += "|r=" + req.session.user.roles;
    }

    var buff = new Buffer(data);  
    var base64data = buff.toString('base64');

    console.log(base64data);  

    return base64data
}

Answer 1

res.redirect(someURL)表示您想向浏览器返回30倍的状态代码，并告诉浏览器转到新的URL。这通常是作为登录过程的一部分在服务器上完成的，有时还可能是当用户发现自己已更改为其他内容的旧URL时。 res.redirect()只能用于这些类型的强制导航到其他URL，并且绝不应该属于任何标准渲染过程。

res.render(filename, data) 这是通常使用EJS（或Express中插入的任何其他模板引擎）来向模板中填充一些数据并将“渲染的” HTML页面返回给请求的浏览器以便浏览器可以渲染的方式。

在问题中显示的特定情况下，当您“批准”登录名时，您可能想要对res.redirect()要用户在登录后从其开始的任何URL进行操作，然后为该URL创建路由res.render()呈现该页面。

然后，步骤将如下所示：

1. 用户转到/login。
2. 用户使用POST表单提交登录数据。
3. 服务器验证数据并建立登录会话。
4. 服务器会res.redirect('/home')（或您在此处想要的任何URL）告诉浏览器转到新URL。
5. 浏览器处理重定向并发送对该新页面的请求。
6. 服务器看到对新页面的请求，并用于res.render()呈现该页面的数据。
7. 浏览器在新的URL上显示呈现的页面。