Connect flash在Pug中未显示消息

基础概念

connect-flash 是一个用于 Express.js 的中间件，用于在请求之间存储一次性消息。这些消息通常用于在用户执行某些操作后显示通知或错误信息。connect-flash 依赖于 session 来存储消息。

相关优势

1. 一次性消息：消息只在当前会话中显示一次，之后会自动清除。
2. 灵活性：可以轻松地在不同的路由和视图中传递消息。
3. 易于集成：与 Express.js 和其他中间件（如 express-session）集成非常简单。

类型

connect-flash 主要用于存储以下类型的消息：

• 通知消息：告知用户操作成功。
• 错误消息：告知用户操作失败或出现错误。

应用场景

• 用户注册成功或失败后的通知。
• 表单提交后的成功或错误提示。
• 密码重置或更改后的通知。

问题原因及解决方法

问题描述

在 Pug 模板中使用 connect-flash 时，消息未显示。

原因

1. 未正确配置 express-session：connect-flash 依赖于 express-session，必须先配置 express-session。
2. 未正确使用 connect-flash 中间件：需要在 Express 应用中正确引入和使用 connect-flash。
3. Pug 模板中未正确显示消息：需要在 Pug 模板中正确引用和显示消息。

解决方法

1. 配置 express-session：

const express = require('express');
const session = require('express-session');
const app = express();

app.use(session({
  secret: 'your-secret-key',
  resave: false,
  saveUninitialized: false
}));

1. 引入和使用 connect-flash：

const flash = require('connect-flash');
app.use(flash());

1. 在 Pug 模板中显示消息：

doctype html
html
  head
    title Connect Flash Example
  body
    if messages.error
      div.error #{messages.error}
    if messages.success
      div.success #{messages.success}

1. 在路由中设置消息：

app.get('/success', (req, res) => {
  req.flash('success', 'Operation successful!');
  res.redirect('/');
});

app.get('/error', (req, res) => {
  req.flash('error', 'Operation failed!');
  res.redirect('/');
});

参考链接

• connect-flash GitHub
• express-session GitHub
• Pug 官方文档

通过以上步骤，你应该能够在 Pug 模板中正确显示 connect-flash 的消息。如果仍然有问题，请检查控制台和日志，确保没有其他错误。