javascript - 如果用户未登录，如何运行模式？

Question

如果用户未登录并尝试为授权用户单击某些内容，我将尝试激活模态。

在服务器端，我知道是否要检查我是否已通过身份验证，我只需编写:if(req.isAuthenticated()) 并 res.render 一个页面。但是，就我而言，我只是想触发一个提示用户登录的模式。所以我需要在客户端执行此操作。那么我如何从客户端执行此操作？下面是我想出的代码，但 isAuthenticated 变量似乎不是答案。

HTML:

<a id="chkLog"><button class=" btn btn-success mr-2 frftr-grn" id="navbtn">Add</button></a> 

client.js(不工作):

$(function () {
  $('#chkLog').click(function () {
      if (isAuthenticated) {
        window.location.href = "/add";
      }
      else {
        $('#chkLog').modal("show");
      }

  });
});

在服务器端我有以下代码:

app.get("/add", (req, res) => {
  if(req.isAuthenticated()){
    res.render("add");
  }else{
    res.render("/")
  }  
});

据我所知，我无法提示服务器端的模态。当然，我必须为服务器端获取请求添加一个 href。所以这让我得出结论，我要么必须找到一种方法从服务器端加载模式，要么尝试从客户端检查用户是否已登录。

Answer 1

在渲染时检查身份验证。即当用户未通过身份验证时呈现 href=# 和 onClick=modalHandler 并且当用户通过身份验证时显示正常链接并删除 onClick 处理程序。 在您的示例中，当用户通过身份验证时，代码将如下所示。

$(function () {
    $('#addBtn').click(function () {
        window.location.href = "/add";
    });
});

当用户未通过身份验证时，您的代码应如下所示。

$(function () {
    $('#addBtn').click(function () {
        $('#myModal').modal("show");
    });
});

生成哪些代码的逻辑必须在ejs模板中实现。当您点击按钮时，点击事件将在浏览器上处理，因此显示模式的代码必须在客户端而不是服务器端编写。