Jade html 在 Express.js 中重定向后未更新

Question

我目前在使用 Jade 的模板引擎和 connect-flash 在 Express.js 中显示 flash 消息时遇到了一些问题。当用户试图向我的数据库中添加一个已经存在的新用户对象时，我只是想闪现一条错误消息。但是，在调用 router.post 并重定向回索引（下面的代码）后，Flash 消息没有显示在我的页面上。

通过各种console.logs和调试，我发现我发的数据确实发对了，并且正在设置flash message。我发现，在重定向时，所有正确的数据都传递给了 Jade 模板，但变量没有在文件本身中更新。我现在想知道这是与会话相关的问题，还是我完全忽略的 Flash/Jade/Express 相关问题？

在下面的代码中，我正在记录会话数据并将闪现消息设置为一个变量。如果 flash 消息的数组为空（即在页面加载时），则会设置一个数组，其中包含这样的消息。如果 flash message(s) 数组包含一条 flash 消息，则测试数组会设置一条这样的消息。

index.js:

router.get('/', function(req, res, next) {
    console.log(req.session);
    var testArray;
    var errorMessages = req.flash('user-error');
    if (errorMessages.length === 0)
        testArray = ['errorMessages is empty'];
    else
        testArray = ['errorMessages contains a message now'];
    console.log(errorMessages);
    console.log(testArray);
    res.render('index', { 
        message: errorMessages,
        tester: testArray, 
        ...other irrelevant vars being passed...
    });
});

router.post('/add', function(req, res, next) {
    var ajaxData = req.body;
    console.log(ajaxData);

    User.findOne({name: ajaxData.name}, function(err, user) {
        if (err) return console.error(err);
        // if User DNE already in DB
        if (user === null) {
            ...new user created and saved here...
        }
        /*where the important stuff begins*/
        else {
            console.log("flash message set");
            req.flash('user-error', "A user with that name already exists!");
        }
        // redirect to index
        res.redirect('/');
    });
});

在我的 Jade 模板中，我再次记录 errorMessages 和 testArray 以确保所有内容都正确传递到文件（它是），然后显示变量。

index.jade

-console.log(message);
-console.log(tester);
.error-box Error: #{message}
.error-box Error: #{tester}

初始加载页面，我将得到以下 HTML 输出：

<div class="error-box">Error: </div>
<div class="error-box">Error: errorMessages is empty</div>

这里没有惊喜。但是，当我提交包含设置错误提示消息的数据的表单时，我从 router.get('/') 和 index.jade 获得更新的日志，其中包含正确的 errorMessages 和 testArray 变量。但是我的 HTML 输出保持不变：

<div class="error-box">Error: </div>
<div class="error-box">Error: errorMessages is empty</div>

显然，传递给 Jade 的变量正在正确更新，但 Jade 似乎根本没有更新 HTML。由于我对 connect-flash 和 Jade 如何工作的了解有限，这会让我相信这是一个与会话相关的问题，但是我在 app.js 中的代码似乎设置正确...

var session = require('express-session');
var flash = require('connect-flash');
app.use(session({
  secret: 'secret',
  cookie: { maxAge: 60000 },
  resave: false,
  saveUninitialized: false
}));
app.use(flash());

我是 Express.js 的新手，所以我觉得可能有一些小问题我忽略了或不明白，但我已经尽力做到尽可能详细，所以我希望有人可以帮助我！

Answer 1

经过更仔细的检查，我发现真正导致问题的是 res.redirect('/') 而不是运行，因为我试图在客户端使用 AJAX呼叫 router.post('/add').

我通过简单地删除我的 AJAX 请求解决了这个问题，然后回到我的 HTML 并将我的表单属性（我通过 AJAX 发送数据的表单）更改为包括 method="POST" 和 action="/add"。这是对我的 router.post('/add').

进行服务器端调用的正确方法

我发现有人遇到了同样的问题here, and this question initially led me to look into the AJAX/Client Side vs. Server Side issue. I found the latter question in a comment from @herbyme on this post。

Jade html 在 Express.js 中重定向后未更新

Jade html not updated after a redirect in Express.js

ajax

node.js

express

connect-flash

pug