api在带有节点js的header.ejs文件上获取请求

Question

i'd like to display data from an endpoint on a header.ejs file which will be shown on all the routed files (eg "/", "/news" "/dogs")

here's my app.js code:

// GET API REQUEST
var url = 'https://url.tld/api/';
request(url, function (error, response, body) {
    if(!error && response.statusCode == 200) {
        var parsedData = JSON.parse(body);
        return parsedData;
    }
});

app.get("/", function(req, res) {
    res.render("index.ejs", {parsedData: parsedData});   
    });

the code from header.ejs:

<li>Active players: <span><%= parsedData["players"] %></span></li>

I get a parsedData is undefined error and I dont know how to get it done in any way. I want to show the active players and a server status in the navbar. What's a common practice to achive this?

Thanks in advance!

Answer 1

Probably you should solve this problem using middleware.

From the express docs :

Middleware functions are functions that have access to the request object (req), the response object (res), and the next middleware function in the application's request-response cycle. The next middleware function is commonly denoted by a variable named next.

Middleware functions can perform the following tasks:

• Execute any code.
• Make changes to the request and the response objects.
• End the request-response cycle.
• Call the next middleware function in the stack.

Middleware always take the request, the response, and the function next as arguments. You do whatever you need to do, and then call next to move onto the next thing on the list.

So, for example, if you wanted to write a simple middleware that would log the time every time the app received a request, you'd say something like:

app.use(function(req, res, next) {
  console.log(Date.now())
  next()
})

So in your case, maybe you'd say:

app.use(function(req, res, next) {
  // stuff
  request(url, function(err, response, body) {
    //stuff
    res.locals.parsedData = parsedData
  })
})

And then in your res.render , you'd say

res.render('index.ejs', {parsedData: res.locals.parsedData})

Again from the express docs :

[res.locals is] An object that contains response local variables scoped to the request, and therefore available only to the view(s) rendered during that request / response cycle (if any). Otherwise, this property is identical to app.locals.

If you know you'll only need to make this request once, attach the parsed data to app.locals instead, and then in the middleware, add a check to see if app.locals.parsedData exists before you run the request.

Hope this helps!