我该如何在Node.js中渲染EJS模板文件？

Question

我在使用Node.js并尝试渲染一个EJS模板文件。我已经找出如何渲染字符串:

    var http = require('http');
    var ejs = require('ejs');

    var server = http.createServer(function(req, res){
        res.end(ejs.render('Hello World'));
    });

    server.listen(3000);

我该如何呈现一个EJS模板文件？

- Headshota

---

你可以渲染一个字符串，为什么不直接将模板文件读取为字符串，然后从那里开始呢？ - sczizzo

事实是，我对node.js非常陌生，不知道如何读取文件 :D。也许现在开始使用模板引擎还为时过早... - Headshota

Answer 1

在 EJS 中有一个函数用于渲染文件，你可以这样做：

在EJS中有一种渲染文件的功能，你只需要执行以下代码：

    ejs.renderFile(__dirname + '/template.ejs', function(err, data) {
        console.log(err || data);
    });

来源: EJS官方文档

- ksloan

---

截至2020年，EJS中的renderFile函数已有文档记录，可以在其主要文档页面（使用部分）中找到：https://ejs.co/#docs - Max

使用 Promise，例如 const html = await ejs.renderFile(templatePath, {extraData})，可能是现在的最佳选择。 - ggorlen

Answer 2

var fs = require('fs');
var templateString = fs.readFileSync('template.ejs', 'utf-8');

然后你做你的事情：

var server = http.createServer(function(req, res){
    res.end(ejs.render(templateString));
});

- Amadan

Answer 3

您只需将文件编译为字符串（可选本地变量），如下所示：

var fs = require('fs'), ejs = require('ejs'), http = require('http'), 
         server, filePath;
filePath = __dirname + '/sample.html'; // this is from your current directory
fs.readFile(filePath, 'utf-8', function(error, content) {
  if (error) { throw error); }
  // start the server once you have the content of the file
  http.createServer(function(req, res) {
    // render the file using some local params
    res.end(ejs.render(content, {
      users: [
        { name: 'tj' },
        { name: 'mape' },
        { name: 'guillermo' }
      ]
    });  
  });
});

- alessioalex

Answer 4

@ksloan的回答真的很好。我也有同样的用例，并进行了一些挖掘。函数renderFile()被重载了。你大多数情况下需要的是：

renderFile(path: string,data, cb)

例如：

举个例子：

ejs.renderFile(__dirname + '/template.ejs', dataForTemplate, function(err, data) {
console.log(err || data)
})

dataForTemplate是一个包含模板中所需值的对象。

- Kartik Malik

Answer 5

@ksloan的回答应该被采纳。他精确地使用了ejs函数来实现这个目的。

以下是如何在Bluebird中使用的示例：

var Promise = require('bluebird');
var path = require('path');
var ejs = Promise.promisifyAll(require('ejs'));

ejs.renderFileAsync(path.join(__dirname, 'template.ejs'), {context: 'my context'})
  .then(function (tpl) {
    console.log(tpl);
  })
  .catch(function (error) {
    console.log(error);
  });

为了完整起见，这里是当前接受答案的承诺版本：

var ejs = require('ejs');
var Promise = require('bluebird');
var fs = Promise.promisifyAll(require('fs'));
var path = require('path');

fs.readFileAsync(path.join(__dirname, 'template.ejs'), 'utf-8')
  .then(function (tpl) {
    console.log(ejs.render(tpl, {context: 'my context'}));
  })
  .catch(function (error) {
    console.log(error);
  });

- Wtower

Answer 6

这个模式还有一个同步版本，它更加紧凑。

var server = http.createServer(function(req, res) {
    var filePath = __dirname + '/sample.html';
    var template = fs.readFileSync(filePath, 'utf8');
    res.end(ejs.render(template,{}));
});

注意使用readFileSync()函数。如果你指定了编码（这里是utf8），该函数将返回一个包含模板的字符串。

- Greg

---

在真实服务器上执行此操作会严重影响性能。 - Nate Ferrero

Answer 7

使用 ejs.renderFile(filename, data) 函数与 async-await。

用于渲染 HTML 文件。

const renderHtmlFile = async () => {
    try {
        //Parameters inside the HTML file
        let params = {firstName : 'John', lastName: 'Doe'};
        let html = await ejs.renderFile(__dirname + '/template.html', params);
        console.log(html);
    } catch (error) {
        console.log("Error occured: ", error);
    }
}

渲染EJS文件。

const renderEjsFile = async () => {
    try {
        //Parameters inside the HTML file
        let params = {firstName : 'John', lastName: 'Doe'};
        let ejs = await ejs.renderFile(__dirname + '/template.ejs', params);
        console.log(ejs);
    } catch (error) {
        console.log("Error occured: ", error);
    }
}

- Ankur Mahajan