Question

我目前正在完成服务器的身份验证方面，可以使用一些帮助。我正在尝试禁用和启用特定选项卡，具体取决于用户是否经过身份验证。当我关注video (part 8)时，作者在HTML文件中使用if条件（{{#if}} {{/ if}}）来检查app.js文件中的变量是否为真。我尝试过但没有成功。我需要传递HTML文件的顶部吗？或者有更好的方法吗？

app.js：

app.use(function(req, res, next) {
    res.locals.isAuthenticated = req.isAuthenticated(); //variable in question
    next();
});

HTML：

<ul class="nav navbar-nav navbar-right">
        {{#if isAuthenticated}} //check if this variable is true or not and if so, show the following elements
        <li class="nav-item" class="navbar-right">
          <a class="nav-link" href="/Profile">Profile</a>
        </li>
        <li class="nav-item" class="navbar-right">
          <a class="nav-link" href="/Logout">Logout</a>
        </li>
        {{else}}
        <li class="nav-item" class="navbar-right">
          <a class="nav-link" href="Register.html">Register</a>
        </li>
        <li class="nav-item" class="navbar-right">
          <a class="nav-link" href="Login.html">Login</a>
        </li>
        {{/if}}
      </ul>

提前致谢！

编辑1：更好的解释

Answer 1

最佳选择是使用视图引擎（例如EJS），然后使用给定变量渲染视图。

app.set('view engine', 'ejs')

^设置视图引擎（首先是npm install ejs）

app.set('views', './views')

^允许您设置视图目录

然后创建视图目录，例如index.ejs文件：

<h1> <%= title %> </h1>

接下来，写下你的路线：

app.get('/', (req, res) => {
    res.render('index', { title: 'Sample title' }) // refers to views/index.ejs
})

在render方法中，您可以传递一个对象（第二个参数），其中包含可在视图中使用的参数。更多信息：http://www.embeddedjs.com/

我应该如何从app.js将变量传递给我的HTML文件？

1 个答案: