重定向后未呈现ejs

时间:2020-06-25 15:18:42

标签: javascript node.js ejs

发布后,我无法重定向到另一个路由器。我在浏览器控制台中看到了我要导航的路线的200状态代码,在响应有效负载中看到了整个页面。通过日志,我看到重定向有效,但是渲染不起作用。 如果我在浏览器中手动编写路线,可以导航到该页面。 我想念什么?

我将向您展示一些代码:

服务器设置:

app.set('port', process.env.PORT || 9000);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.use(require('./routes'));
app.use(express.static(path.join(basedir, 'public')));

路由文件:

router.get('/', (req, res) => {
    res.render('login');
});

router.post('/login', (req, res) => {
    res.redirect('/index');
})

router.get('/index', (req, res) => {
    res.render('main-page');
})

PD:是的...我是Node的新手。

1 个答案:

答案 0 :(得分:0)

从您所说的内容看来,您是在发送 AJAX请求。这意味着响应已传递到您的JavaScript代码,而不是导航。因此,基本上,重定向“有效”,因为它重定向了您的AJAX请求并返回了重定向的页面内容。

如果要通过浏览器提交表单(仅使用基本的<form>元素),则会看到一个导航。

为使导航在AJAX请求后发生,您不应使用res.redirect,而应在要重定向的页面上返回一些JSON(例如res.send({ redirectTo: '/index' })-命名是您的选择),然后在客户端代码中获取响应后检查redirectTo参数,并使用location.assign手动导航到该参数。

示例:

服务器代码:

router.post('/login', (req, res) => {
  res.send({ redirectTo: '/index' })
})

客户代码:

const result = await fetch('/login', { method: 'POST' })
const { redirectTo } = await result.json()
if (redirectTo) {
  location.assign(redirectTo)
}

或者,如果重定向目标是静态的,则不需要任何redirectTo值,而可以在客户端代码中对目标进行硬编码。

如果您想同时允许表单提交或AJAX请求(也许您进行了渐进式增强,并且页面也被设计为在没有JavaScript的情况下也可以正常工作),则可以检查Accept标头,看看是否接受HTML(req.accepts("html")),如果接受,则返回重定向,否则返回JSON。同样,在发生错误的情况下,您可以有条件地呈现错误页面或返回带有客户端消息知道如何处理的错误消息的JSON。