如何在 express 4.x 中将 connect-flash 与 ejs 一起使用答案

【问题标题】：How to use connect-flash with ejs in express 4.x如何在 express 4.x 中将 connect-flash 与 ejs 一起使用
【发布时间】：2021-01-12 22:25:02
【问题描述】：

我有一个项目需要使用connect-flash，我正在使用视图引擎作为 ejs。即使我配置一切都很好，在我看来，connect-flash 也不起作用。有人可以帮我解决这个问题吗？

我是如何定义会话、连接闪存和全局变量的：

app.use(cookieParser());
//Express session middleware
app.use(session({
    secret: 'secret',
    resave: true,
    saveUninitialized: true
}));

//Connect flash middleware
app.use(flash());

//Global varibales
app.use(function (req, res, next) {
    res.locals.error = req.flash('error');
    res.locals.success = req.flash('success');
    next();
});

这里是导出模块get函数：

module.exports.xxx_index_get = function(req, res) {
xxx.findOne({
    id: 'xxx'
}).then(xxx=> {
    req.flash('success', 'user succesfulyl registered')
    res.render('xxx/xxx', {
        xxx
    });
});};

这里是 ejs 文件：

<% if(success.length > 0) { %><div class="alert alert-success">
<%= success %>    </div><% } %>

如果有人能提供帮助，我将非常感激。我错过了什么吗？

【问题讨论】：

请添加您的错误。
没有错误就是问题所在...

标签： node.js ejs connect-flash

【解决方案1】：

我假设您已经了解了 Flash 的所有基本细节。

在您的路线中包含以下代码

module.exports.xxx_index_get = function(req, res) {
xxx.findOne({
    id: 'xxx'
}).then(xxx=> {
    req.flash('success', 'user succesfulyl registered')
res.locals.message = req.flash();
    res.render('xxx/xxx', {
        xxx
    });
});};

然后在你的视图中尝试使用这样的东西

<% if(locals.message){ %>
    <div class="alert alert-success" role="alert">
        <strong>Well done!</strong> <%=message.success%>
    </div>
    <% } %>

希望对你有所帮助。

【讨论】：

【解决方案2】：

这是另一个解决方案

//middlewares/flashMessage.js
exports.flashMessage = function (req, res, next) {
    const successFlashMessageArr = req.flash('success');
    const errorFlashMessageArr = req.flash('error');
    res.locals.successFlashMessage = successFlashMessageArr[0];
    res.locals.errorFlashMessage = errorFlashMessageArr[0];
    next();
}

在 app.js 中使用这个中间件

const flashMessageMiddleware = require('./middlewares/flashMessage');
app.use(flashMessageMiddleware.flashMessage);

并且在EJS文件中，可以使用全局变量

<% if(successFlashMessage){ %>
<div class="alert alert-success">
    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
    <%=successFlashMessage%>
</div>
<% } %>

<% if(errorFlashMessage){ %>
<div class="alert alert-error">
    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
    <%=errorFlashMessage%>
</div>
<% } %>

【讨论】：

你的中间件拯救了我的一天。谢谢。 ?

【解决方案3】：

您可以使用 Daud Khan 的示例，但是，当声明消息超出范围时，使用 <%- %> 显示您的消息

您的消息外观示例：

<% if(successFlashMessage){ %>
<div class="alert alert-success">
    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
    <%- successFlashMessage %>
</div>
<% } %>

<% if(errorFlashMessage){ %>
<div class="alert alert-error">
    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
    <%- errorFlashMessage %>
</div>
<% } %>

【讨论】：