Nodejs express3中req.flash无法保存进res.locals里的解决办法

Nodejs express3中req.flash无法保存进res.locals里的解决办法

在app.js里用

app.use(function (req, res, next) { res.locals.error= req.flash(‘error’).length ? req.flash(‘error’) : null; next(); });

前端（如template.ejs）文件调用时用

<% if(locals.error) { %> <div class=“alert alert-error”> <%= locals.error %> </div> <% } %

不会输出任何东西

原因是req.flash(‘error’)执行一次就会消失。 所以在执行过req.flash(‘error’).length这句话后req.flash(‘error’)的内容已经消失就不会赋值给res.locals.error，在前端也就不会显示。

解决办法是先把req.flash(‘error’)用变量存下来

app.use(function (req, res, next) { //req.flash(‘error’);只执行一次，随后消失，所以要先保存进变量 var err = req.flash(‘error’); res.locals.error = err.length ? err : null; next(); });


13 回复

Nodejs express3中req.flash无法保存进res.locals里的解决办法

在使用Express 3.x版本的项目中，你可能会遇到一个常见的问题：req.flash('error') 在渲染模板时无法正确地保存到 res.locals 中。这主要是因为 req.flash('error') 一旦被访问就会从会话中移除。

问题描述

在你的 app.js 文件中，你可能有类似这样的代码：

app.use(function (req, res, next) {
    res.locals.error = req.flash('error').length ? req.flash('error') : null;
    next();
});

然后在前端模板（例如 template.ejs）中尝试这样调用：

<% if(locals.error) { %>
<div class="alert alert-error">
    <%= locals.error %>
</div>
<% } %>

你会发现 locals.error 没有内容输出。

原因分析

req.flash('error') 方法会将错误信息从会话中移除，这意味着当你第一次调用 req.flash('error') 来获取错误信息时，这些信息会被移除。因此，第二次调用 req.flash('error') 时，它将返回空数组或空字符串。

解决方案

为了解决这个问题，你需要将 req.flash('error') 的结果存储在一个变量中，然后再将这个变量赋值给 res.locals.error。这样可以确保即使在后续的渲染过程中，错误信息仍然存在。

修改后的代码如下：

app.use(function (req, res, next) {
    var err = req.flash('error');  // 先将错误信息存储在变量中
    res.locals.error = err.length ? err : null;
    next();
});

示例代码

完整的 app.js 可能看起来像这样：

var express = require('express');
var flash = require('connect-flash');

var app = express();

// 使用flash中间件
app.use(flash());

app.use(function (req, res, next) {
    var err = req.flash('error');  // 先将错误信息存储在变量中
    res.locals.error = err.length ? err : null;
    next();
});

app.get('/', function (req, res) {
    req.flash('error', '这是一个错误消息');
    res.render('template', { title: '首页' });
});

app.listen(3000, function () {
    console.log('应用运行在 http://localhost:3000/');
});

在 template.ejs 中：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title><%= title %></title>
</head>
<body>
<% if(locals.error) { %>
<div class="alert alert-error">
    <%= locals.error %>
</div>
<% } %>
</body>
</html>

通过这种方式，你可以确保错误信息能够正确地传递到模板中并进行渲染。


谢谢分享~ 如果有用session的话，flash里的内容默认是存到session里，也就是说 res.locals.error = req.session? req.session.error : null

学习了。 谢谢分享~

你是怎么发现的？牛~

太牛了。。。

执行到

 var err = req.flash('error');

后台提示

TypeError: Object #<IncomingMessage> has no method 'flash'

这里有答案 http://www.cnblogs.com/meteoric_cry/archive/2012/07/27/2604890.html 注意上述的代码，app.use(flash());要放在session之前

太感谢了！！！

为什么我的res.locals会输出undined? 求解

  app.use(function(res, req,next) {
    console.log(res.locals); //undined
    res.locals.success = req.session? req.session.success : null;
    res.locals.user = req.session? req.session.user : null;
    res.locals.error = req.session? req.session.error : null;
  });

第一行的变数次序错了，是 function(req, res, next) …

太感谢了，弄了好久这个东西，原来是这个原因

谢谢分享~~

在Express 3中，req.flash消息在每次请求处理时都会被清空。因此，直接从req.flash读取两次会导致第二次读取时没有数据。为了解决这个问题，我们需要一次性读取req.flash的内容并将其存储在一个变量中，然后使用该变量来设置res.locals.error。

解决办法

修改中间件

// app.js
app.use(function (req, res, next) {
    var err = req.flash('error'); // 先将 flash 信息存储到变量中
    res.locals.error = err.length ? err : null; // 使用变量设置 res.locals
    next();
});

前端模板调用

在前端模板中调用时，可以像原来一样使用：

<% if (locals.error) { %>
<div class="alert alert-error">
    <%= locals.error %>
</div>
<% } %>

解释

  1. 中间件修改：在中间件中，我们首先将req.flash('error')的结果存储到一个名为err的变量中。这样，即使req.flash('error')在后续操作中被清空，我们也已经有了备份。

  2. 设置 res.locals.error：然后，我们将err变量的内容赋值给res.locals.error，确保前端模板能够正确访问这些错误信息。

这种方法保证了即使req.flash信息被清空，res.locals.error仍然包含有效的错误信息，从而前端模板能够正常显示错误提示。

通过这种方式，您可以确保在Express 3应用中正确地处理并显示闪现消息。

回到顶部