2

代码:

登录.ejs

<script>
    req.flash('success_msg', 'You have logged in');
</script>

头文件.ejs

<div class = "alertMessage">

    <% if (success_msg != false){ %>
        <span class="alert alert-success containerMargins">
            <%= success_msg %>
        </span>
    <% } %>
    <% if (error_msg != false){ %>
        <span class="alert alert-danger containerMargins">
            <%= error_msg %>
         </span>
    <% } %>

    </div>

情况:

这与在服务器端使用 flash 并在客户端显示消息无关:它对我来说已经很完美了。

这与从客户端调用闪存或使用其他库从客户端复制相同行为有关。


问题:

我展示的代码当然不适用于客户端,我该怎么做才能在客户端复制该行为?

4

2 回答 2

1

flash 是会话的一个特殊区域,用于存储消息。消息写入闪存并在显示给用户后清除。flash 通常与重定向结合使用,以确保消息可用于要呈现的下一页。

因此,您需要以下代码:

  1. 将一些数据存储在客户端可以在页面之间访问的某个位置
  2. 读取该数据
  3. 读取后删除

首先为选项 1 选择某个地方(例如 localStorage 或 cookie)。其余的应该是微不足道的——原始模块大约有80 行代码,包括大约 50% 的注释——要实现(但具体到你做出的选择)。

于 2017-01-17T12:24:08.567 回答
1

这是我使用的解决方案:

<div class = "alertMessage">

    <span class="alert alert-success containerMargins" id="successDiv"></span>

    <span class="alert alert-danger containerMargins" id="errorDiv"></span>

</div> 

<script>

        if (localStorage.getItem("success_msg_local") != null) {
            document.getElementById("successDiv").innerText = localStorage.getItem("success_msg_local");
            document.getElementById("successDiv").style.display = "inline-block";
            window.localStorage.clear();
        }
        else if (localStorage.getItem("error_msg_local") != null) {
            document.getElementById("errorDiv").innerText = localStorage.getItem("error_msg_local");
            document.getElementById("errorDiv").style.display = "inline-block";
            window.localStorage.clear();
        }

</script>

并替换req.flash('success_msg_local', 'You have logged in')为:

localStorage.setItem('success_msg_local', 'You have logged in');
于 2017-01-17T14:59:55.020 回答