这个 handlebars 变量绑定是如何完成的?

How is this handlebars variable binding being accomplished?

总结

Handlebars 教程使用了未明确绑定的变量。我是车把新手,所以我的猜测是正在进行一些隐式绑定。我需要修改代码,但我不知道这个绑定是如何工作的,甚至不知道要搜索什么。


我正在构建一个 nodejs 应用程序来与 Microsoft Graph 交互 API。从技术上讲,我使用一些 Microsoft tutorial code 作为起点。本教程是使用 express 和 handlebars 构建的。

教程是 运行,一切正常。

现在我正在修改代码,但我无法发现 handlebars 变量绑定如何为 user 变量工作。 user 变量显示在视图 index.hbslayout.hbs 中,例如:

{{#if user}}
  <h4>Welcome {{ user.displayName }}!</h4>
  <p>Use the navigation bar at the top of the page to get started.</p>
{{else}}
  <a href="/auth/signin" class="btn btn-primary btn-large">Click here to sign in</a>
{{/if}}

我是把手的新手,即使在阅读了一些教程之后我仍然不明白这种绑定是如何发生的。我在 app.js 函数 signIncomplete(),

中找到了以下行
const user = await graph.getUserDetails(accessToken);

其中 getUserDetails() 函数创建 user 对象,如下所示::

const user = await client.api('/me').get();

函数signInComplete()访问user.mailuser.userPrincipalName,但是没有明确的代码在函数外公开这个变量。然而,当呈现车把模板时,变量以某种方式被绑定。我检查了调试器中的 user 变量,所以我知道视图中的数据一定来自 signInComplete()。我读过的少数 handlebars 参考资料展示了如何将对象绑定到已编译的模板,但这不是这里发生的事情。

这个绑定是如何完成的?正如我提到的,我是一个车把新手,所以如果这是一个特殊情况或功能,我不知道它叫什么或如何搜索它。因此 link 文档将不胜感激。

绑定发生在您链接到的教程源代码中的 line 162 of app.js 上。代码是:

app.use(function(req, res, next) {
  // Set the authenticated user in the
  // template locals
  if (req.user) {
    res.locals.user = req.user.profile;
  }
  next();
});

要了解这里发生的事情,我们必须介绍一些事情。

首先,Passport JS 用于身份验证。 Passport JS 是 Node 应用程序的身份验证中间件。基本上,Passport 根据请求对象中的某些数据对用户进行身份验证。如果请求可以通过身份验证,Passport 会将经过身份验证的用户数据添加为请求上的 user 属性 (req) 对象以供后续处理程序使用。

在上面的代码中,我们可以看到正在访问 Passport 添加的 req.user 值并将其分配给 res.locals.userres.locals 是 Express 应用程序中的一个对象,它允许将 per-request 数据附加到响应 (res) 对象。

hbs 是本教程中使用的 Express 的 Handlebars 视图引擎。绑定值 res.locals 的是 hbs 中间件,以便 Handlebars 模板可以访问它们。