【问题标题】:EJS variable reference from Express showing as undefined来自 Express 的 EJS 变量引用显示为未定义
【发布时间】:2014-12-05 00:16:59
【问题描述】:

lot of great help from user Jobsamuel 之后,我在获取我试图从 API 调用中获取的数据以显示在浏览器中时遇到了一些困难:

// An express route.
app.get('/activities', function (req, res) {
   if (req.user !== null) {

      // User is authenticated.
      getUserActivities(req.user.id, res);
    } else {

      // Redirect to login the user isn't authenticated.
      res.redirect('/login');
    }
});


// This function will make API calls to Fitbit
// using the User ID we got from the PassportJS
// authentication process.
function getUserActivities(id, res) {

// It will request from Fitbit User activities.
request('https://api.fitbit.com/1/user/'+ id +'/activities/',
     function (error, response, body) {
        if (!error && response.statusCode == 200) {

            // If everything goes well.

            return res.send(body);
        } else {

            // If something wrong happens.
            return res.send(error);
        }
      }
);

}

我想在使用 EJS 的网页上显示body,我尝试过这样的操作:<%= this.body %>。页面在浏览器中呈现,但变量显示为undefined。我在这里做错了什么?我认为这只是一个语法问题,但我觉得好像我错过了一个步骤。

编辑:我打电话给res.render()的代码:

app.get('/', function(req, res){
  res.render('index', { user: req.user}, {body : body});
});

app.get('/account', ensureAuthenticated, function(req, res){
  res.render('account', { user: req.user });
});

app.get('/login', function(req, res){
  res.render('login', { user: req.user });
});

编辑 2:index.ejs 的相关部分

<body>
<% if (!user) { %>
    <h2>Welcome! Please log in.</h2>
<% } else { %>
    <!-- <h2>Hello, <%= user.displayName %>.</h2> -->
<div id="wrapper">
    <div id="blank"></div>
    <div id="content">
      <div id="info">
        Output: <%= this.body %>
      </div>
    </div>
  </div>
<% } %>
</body>

更新:问题仍然存在。我感觉要放弃这个了。这里肯定少了点什么,对吧?

【问题讨论】:

  • 您的&lt;%= this.body %&gt; 在哪个模板中?该模板是在前端呈现的,还是在服务器端某处执行res.render()
  • 它在index.ejs,我已经在服务器上渲染了。如果有帮助,我可以发布该代码。
  • 好的,你在哪里打电话给res.render('index')?听起来您需要将 body 传递给 res.render('index', { body: body }) 而不是 res.send(body) ,后者只是将文本发送到浏览器而不是通过模板。此外,您可能希望将 this.body 更改为 body
  • 您只能将一个变量对象传递给render()。这意味着你应该使用这个:res.render('index', { user: req.user, body: body});。之后,您只需要确保在该路由之前的某些中间件中设置res.locals.body,否则您应该在该路由中获取body,但是您想这样做。

标签: javascript node.js express ejs


【解决方案1】:

在渲染部分,您只需发送一个对象,其中包含所有变量:

res.render('index', { user: req.user, body : body});

变量userbody将被发送到模板(this.body

模板:

Output: <%= body %>

因此,在您的情况下,需要将“/”路由更改为:

app.get('/', function(req, res){
  res.render('index', { user: req.user}); //no need for the body variable which doesn't exist yet 
});

而且你需要'/activities' 路由来使用索引视图,这一次需要一个body 变量,所以你必须使用res.render。

此外,您应该将正文或错误作为回调发送到您的函数,然后执行如下操作:

app.get('/activities', function (req, res) {
   if (req.user !== null) {

      // User is authenticated.
      getUserActivities(req.user.id,function(body){
        res.render('index', { user: req.user, body : body}); //body will contain either body or err depending on what your function returned
      });
    } else {
      res.redirect('/login');
    }
});

function getUserActivities(id,callback) {
    request('https://api.fitbit.com/1/user/'+ id +'/activities/',
        function (error, response, body) {
            if (!error && response.statusCode == 200) {
                callback(body);
            } else {
                callback(error);
            }
        }
    );
}

res.render 与 res.send 的解释

res.send 会将原始变量转发到您的浏览器。如果需要它通过视图,则需要使用 res.render。因此,如果您尝试通过 AJAX 调用查询 /activities 并在客户端处理原始结果,则使用 res.send 会很好。请参阅 res.sendres.render 的文档

【讨论】:

  • console.log(body) 就在 res.send 之前,有内容吗?
  • 它看起来不像在app.get(...) 下打印的任何内容。奇怪。
  • 对不起,我不明白你的意思。您可以在 getUserActivities 函数中(回调之前)console.log(body) 吗?
  • 我的意思是当我打印一个像 app.get('/activities', function (req, res) { if (req.user !== null) { // 用户已通过身份验证的文字字符串时。 getUserActivities(req.user.id,function(body){ console.log('BODY!!!'); 它什么也没显示。
  • 现在执行res.render('index', { user: req.user, body : body}); 会出现错误ReferenceError: body is not defined at app.get.res.render.user
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-12-21
  • 2023-03-06
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多